js对象调用和动态生成js对象

function Lift(num){
    this.num = num;
    console.log('我是' + num + '号电梯');
}
Lift.prototype = {
    constructor: Lift,
    list: {
        floors:[]
    },
    currpos: $('.active').data('floor'),
    buildLift: function(floornum, num){
        var wrap = $('.lift');
        //判断是否将已生成的电梯置空,否则电梯会多出很多
        $('.lift-box').length >= num ?    wrap.html('') : '';
        //生成电梯样式
        wrap.prepend('<div class="lift-box '+ num +'" ></div>');
        var list = $('.'+ num +'')
        for(let i = 1; i <= floornum; i++){
            list.prepend(function(){
                if(i == 1){
                    return '<div class="box active" class="active" data-floor='+ i +'></div>'
                } else {
                    return '<div class="box" data-floor='+ i +'></div>'
                }
            });
        }
    },
    goto: function(floornum,controller){
        //绑定this对象
        var $this = this;
        //为按钮添加状态
        
        //将要去的楼层保存到list数组中
        this.list.floors.push(floornum);
        //获取当前电梯的位置
        var currpos = $('.active').data('floor');
        
        //获取所有电梯数量
        var allbox = $('.box');
        var _allbox = [];
        //因为移动方向总是上下相反,将数组内容倒置一下
        for (let i = allbox.length; i > 0; i--){
            var j = Math.abs(i - allbox.length);
            _allbox[i] = allbox[j];
        }
        setTimeout(function show(){
        //电梯运行时去掉电梯的颜色
        allbox.removeClass('active');
        //找到要修改的电梯的颜色
        var currbox=_allbox[currpos];
        $(currbox).addClass('active');
        //去掉控制按钮状态
        currpos == floornum ? $('#'+controller.id+'.'+controller.classList[0]).removeClass('arrow-active') : ''
        
        if(currpos < $this.list.floors[$this.list.floors.length - 1]){
            currpos++;
        }else if(currpos > $this.list.floors[$this.list.floors.length - 1]){
            currpos--;
        }
        
        setTimeout(show,300);
        },300)
        return true
    }
    
}
function lift_controller(controller){
    //添加控制按钮状态
    $('#'+controller.id+'.'+controller.className).addClass('arrow-active');

    console.log(lift1.currpos);
    // console.log(lift1);
    lift1.goto(controller.id)    
}
//界面有选择几部电梯和电梯层数的按钮
$('.confirm').on('click' ,function(){
    //TODO不能为小数和0
    let floornum = $('.floornum').val();//层数
    let liftnum = $('.liftnum').val();//电梯数量
    //根据用户要求生成n部电梯
    for (let i = 1; i <= liftnum; i++){
        lift = 'lift' + i;
        new Lift(i).buildLift(floornum, i);
    }
});

在写的过程中遇到几个问题,一直没想明白,请高手指点指点
1.想通过for循环去创建电梯实例,这样通过buildLift()方法就可以在界面生成电梯样式了,但是电梯实例的变量lift出click方法后,变量名不能用了
2.通过lift_controller()方法,去控制这几部电梯去运行,例如想通过lift1.goto()去调用,但是发现无论是执行lift1.goto()还是lift2.goto(),都是第一部电梯在执行。
3.Lift的属性值currpos: $('.active').data('floor'),是想计算每部电梯的当前电梯所在楼层,但是为什么$('.active').data('floor')没有执行呢?

阅读 2.1k
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题