0

所以我试图通过ajax调用替换一堆图像,但是在某些情况下,同一个图像被多次加载,这是由ajax调用的异步性质引起的。(不按顺序调用success函数)我意识到jQuery.ajax函数确实有一个async参数:false,但是我用ajax调用加载的页面有点大,如果同步加载,加载时间会很糟糕. 有没有办法仍然使用异步但同时确保每个图像都能正确加载?

jQuery(document).ready(function($) {
    var thumb = $('.ihPhotoThumb');                 //original image elements
    for(var i = 0; i < thumb.size(); i++){          //go through all the images
        replaceImage($('.ihPhotoThumb').eq(i));     //call this function to replace the images
    }
});

function replaceImage(elem1){
    jQuery.ajax({
        url: elem1.parent().attr('href'), 
        success: function(data){
        var image_url =(jQuery(data).find("#ihf_detail_mainphoto_lrg img").attr('src')); //get the image url, which is wrapped in "#ihf_detail_mainphoto_lrg img"
        elem1.attr('src', image_url);              //replace the picture
    }
});

}

有问题的页面位于此处:http ://www.idxre.com/toppicks/52813/OffBeachUnder3m/71472 脚本从第 1714 行开始。

4

2 回答 2

0

正如 Nosredna 在另一篇文章中所说(相同的基本问题):

“你有两个我能想到的选择。一个是通过回调将它们链接起来。另一个是使调用同步而不是异步。

您是否有理由希望它们按顺序排列?这会让事情变慢。

要使调用同步,您需要将 Ajax 调用中的 async 选项设置为 false。请参阅http://docs.jquery.com/Ajax/jQuery.ajax#options上的文档 (单击选项选项卡查看它们)。

那里还有一个插件链接,您可能会觉得很方便。

链接:如何使所有 AJAX 调用顺序?

于 2012-06-14T05:54:25.550 回答
0

我能够通过这里描述的方法解决我的问题:http: //damiannicholson.com/2010/07/07/jquery-ajax-queue.html

我想我一直在寻找的解决方案是使 Ajax 调用异步但顺序的,因此 Nosredna 为我指明了正确的方向。

我不是 javascript 专家,所以也许有人可以改进我的答案。但我认为最初导致问题的原因是成功函数异步返回,当两个成功函数同时执行时,elem1 变量被另一个成功函数覆盖,这对我来说没有意义,因为函数作用域变量,但也许有人可以详细说明。

于 2012-06-14T19:28:52.607 回答