[英]jquery animation callback - how to pass parameters to callback
我正在从多维数组构建一个jquery动画,并且在每次迭代的回调中,我想使用数组的一个元素。 但不知怎的,我总是最终得到数组的最后一个元素而不是所有不同的元素。
HTML:
<div id="square" style="background-color: #33ff33; width: 100px; height: 100px; position: absolute; left: 100px;"></div>
JavaScript的:
$(document).ready(function () {
// Array with Label, Left pixels and Animation Lenght (ms)
LoopArr = new Array(
new Array(['Dog', 50, 500]),
new Array(['Cat', 150, 5000]),
new Array(['Cow', 200, 1500])
);
$('#square').click(function() {
for (x in LoopArr) {
$("#square").animate({ left: LoopArr[x][0][1] }, LoopArr[x][0][2], function() {
alert (LoopArr[x][0][0]);
});
}
});
});
`
目前的结果:牛,牛,牛
期望的结果:狗,猫,牛
如何确保在回调中返回相关的数组元素?
问题是x
在回调评估时被修改。 您需要为它创建一个单独的闭包:
for (x in LoopArr) {
$("#square").animate({ left: LoopArr[x][0][1] }, LoopArr[x][0][2],
(function (z) {
return function() {
alert (LoopArr[z][0][0]);
}
})(x));
}
我已将参数重命名为z
以供澄清,您将x
作为参数传递给函数,该函数返回一个函数,该函数使用作用域z
变量,该变量在传递时存储x
的状态。
Javascript中的经典错误。 尝试这个:
for (x in LoopArr) {
(function(x) {
$("#square").animate({ left: LoopArr[x][0][1] }, LoopArr[x][0][2], function() {
alert (LoopArr[x][0][0]);
});
})(x);
}
这确保了在循环执行时创建的每个动画回调函数都有一个不同的变量。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.