0

对于相册,我加载了一个文件(通过 ajax),该文件返回我想要显示的图像的 src 数组。它们必须按照 ajax 调用返回的确切顺序显示。

我正在使用其中包含.load()函数的 for 循环,但这样它就不会同步。如果我在.load()函数内部输出 i 的值,它不会变为 0、1、3、4 等,而是 0、3、2、4 等。

我的代码的简化版本:

$.get('photostack.php', {album_name:album_name} , function(data) {
var items_count = data.length;
for(var i = 0; i < items_count; ++i){
    var item_source = data[i];
    var cnt = 0;
    $('<img />').load(function(){
        var $image = $(this);
        ++cnt;
        console.log(i);
        $ps_container.append($image);
    }).attr('src',item_source).attr('class',i);
}
},'json');

console.log(i)现在给出错误的顺序。它应该是完美的上升。

我已经尝试了很多东西。将每个负载延迟 100 毫秒,使用对象作为cnt/的变量i等,但它们都不起作用。

4

2 回答 2

2

这是因为.load. 您无法预测何时调用回调函数。要同步它们,请使用Deferred 对象

于 2012-04-29T12:41:01.907 回答
0

不确定我是否真的明白了,但也许这样的事情会起作用:

$.get('photostack.php', {album_name:album_name} , function(data) {
    for(var i = 0; i < data.length; i++){
        var image = new Image();
            image.src = data[i];
            image.className = i;
            image.style.display = 'none';
        $(image).appendTo($ps_container).load(function() {
            $(this).show();
        });
    }
},'json');​
于 2012-04-29T13:21:25.740 回答