JQuery动画队列是否按相反顺序执行?
我有一个递归函数,它在页面上步进一个元素的动画:JQuery动画队列是否按相反顺序执行?,jquery,jquery-animate,Jquery,Jquery Animate,我有一个递归函数,它在页面上步进一个元素的动画: _this = this; this.x = 0, this.y = 0; this.targX = 5, this.targY = 5; this.go = function(){ var xDir = 0, yDir = 0, finished = false; if(this.x>this.targX){ console.log("Reverse x"); xDir = -1;
_this = this;
this.x = 0, this.y = 0;
this.targX = 5, this.targY = 5;
this.go = function(){
var xDir = 0, yDir = 0, finished = false;
if(this.x>this.targX){
console.log("Reverse x");
xDir = -1;
}else if(this.x<this.targX){
console.log("Forward x");
xDir = 1;
}else{
xDir = 0;
if(this.y>this.targY){
console.log("Reverse y");
yDir = -1;
}else if(this.y<this.targY){
console.log("Forward y");
yDir = 1;
}else{ finished = true; }
}
this.x+= xDir;
this.y+= yDir;
if(finished==false){
this.$c.animate({
left: "+="+32*xDir,
top: "+="+32*yDir
}, 200, _this.go());
}
}
这里发生了什么,为什么动画队列以相反的方式执行?我是否做错了什么,或者这是JQuery的预期行为
编辑:在此处摆弄:分配回调时,正在调用回调函数
if(finished==false){
this.$c.animate({
left: "+="+32*xDir,
top: "+="+32*yDir
}, 200, _this.go()); // should be _this.go
}
分配回调函数时,正在调用回调函数
if(finished==false){
this.$c.animate({
left: "+="+32*xDir,
top: "+="+32*yDir
}, 200, _this.go()); // should be _this.go
}
以书面形式:
this.$c.animate({
left: "+=" + 32 * xDir,
top: "+=" + 32 * yDir
}, 200, _this.go());
实际上,您正在调用go()
,并将它返回的值(undefined
在本例中)传递给animate()
您应该传递函数本身:
this.$c.animate({
left: "+=" + 32 * xDir,
top: "+=" + 32 * yDir
}, 200, _this.go);
以书面形式:
this.$c.animate({
left: "+=" + 32 * xDir,
top: "+=" + 32 * yDir
}, 200, _this.go());
实际上,您正在调用go()
,并将它返回的值(undefined
在本例中)传递给animate()
您应该传递函数本身:
this.$c.animate({
left: "+=" + 32 * xDir,
top: "+=" + 32 * yDir
}, 200, _this.go);
你有没有可能摆弄一把小提琴?你正在调用this.go()并将结果传递给
animate()
,而不是传递方法本身。他是对的——用\u这个。go
而不是\u这个。go()
哇,让我大吃一惊。这也解释了我遇到的其他几个问题。非常感谢!发布作为答案,我会接受。你有没有可能设置一把小提琴?你正在调用\u this.go()
,并将其结果传递给animate()
,而不是传递方法本身。他是对的——使用\u this.go
而不是\u this.go()
哇,让我大吃一惊。这也解释了我遇到的其他几个问题。非常感谢!作为答案发布,我会接受的。非常好的答案,当场-弗雷德里克刚刚击败了你=/非常好的答案,当场-弗雷德里克刚刚击败了你=/