在等待jquery完成动画时javascript被覆盖

Question

我有以下代码:

myObject = function(id){
    var self = this;
    var id = id;

    self.printId = function(){
        console.log(id)
    }
}

var index = 1;

function createObj(){
    myobj = new myObject(index);
    index++;

    jquery.animate({...},5000,function(){
        myobj.printId();
    });
} 

createObj();
createObj();

输出是:

2
2

我期望:

1
2

显然,当调用第二个createObj()时,我的原始myobj被覆盖.如何确保在等待动画完成时不覆盖我的myobj？

Answer 1

你需要在当时放置var关键字来声明你的新对象.

它是一个范围问题.

function createObj(){
    var myobj = new myObject(index);
    index++;

   jquery.animate({...},5000,function(){
       myobj.printId();
   });
 }