Jquery 每个循环

我对jquery完全陌生，但我有一个.each循环，它使用ajax获取一些数据，然后更新列表元素。现在。每个循环都会同时列出所有元素。。。我需要它做第一个，等到它完成，然后再做第二个等等。我不想使用延迟。我希望循环实际等待数据被提取，然后继续下一个元素。请不要用延迟来伪装它。这是我的简化代码

$(document).ready(function() {
    $.ajaxSetup({cache:false});
    $('#friendslist li').each(function(index) {
        var post_id = $(this).attr("id")
        $(this).find(".status div").html("<img src='http://www.url.com/image.jpg'/>");
        $(this).find("#replace").load("http://www.url.com/ajaxstuff",{id:post_id});
    })
});

$（文档）.ready（函数（）{
$.ajaxSetup（{cache:false}）；
$（'#friendslist li'）。每个（函数（索引）{
var post_id=$（this.attr（“id”）
$（this.find（“.status div”）.html（“”）；
$（this）.find（#replace”）.load（“http://www.url.com/ajaxstuff“，{id:post_id}）；
})
});

---

提前感谢您的帮助

如果希望循环等待，可以将

async

选项设置为

false

，这将使浏览器在执行时不可用

像这样

$.ajaxSetup({cache:false, async:false});

---

如果希望循环等待，可以将

async

选项设置为

false

，这将使浏览器在执行时不可用

像这样

$.ajaxSetup({cache:false, async:false});

---

设置一个队列，在其中放置每个函数。调用队列中的第一个函数。当它完成执行时，它应该弹出队列中的下一个函数并执行它，依此类推。不要使用同步Ajax请求，因为这会锁定浏览器

简化示例：

var queue = [];
queue.push(function(){
    $("#replace").load("somefile.html", function(){
        // Still need to check that another element to pop exists
        (queue.pop())();
    });
});
queue.push(function(){
    $("#replace2").load("somefile2.html", function(){
        // Still need to check that another element to pop exists
        (queue.pop())();
    });
});
(queue.pop())();

---

请注意，这可以进一步优化，并且您仍然需要检查是否存在可以弹出并执行的另一个。但是，这只是一个开始。

设置一个队列，在其中放置每个函数。调用队列中的第一个函数。当它完成执行时，它应该弹出队列中的下一个函数并执行它，依此类推。不要使用同步Ajax请求，因为这会锁定浏览器

简化示例：

var queue = [];
queue.push(function(){
    $("#replace").load("somefile.html", function(){
        // Still need to check that another element to pop exists
        (queue.pop())();
    });
});
queue.push(function(){
    $("#replace2").load("somefile2.html", function(){
        // Still need to check that another element to pop exists
        (queue.pop())();
    });
});
(queue.pop())();

---

请注意，这可以进一步优化，并且您仍然需要检查是否存在可以弹出并执行的另一个。但是，这只是一个开始。

您需要重新构造代码。您需要在上一个查询的回调中运行下一个“查询”。因为.load将异步运行

您需要重新构造代码。您需要在上一个查询的回调中运行下一个“查询”。因为.load将异步运行

您可以在

load（）

处理程序中递归地再次调用函数，而不是执行$.each循环

function LoadFriends(i) {
    $("#friendslist li:eq(" + i + ")").load('/echo/html/', {
        html: 'Hello!', delay: 1
    }, function() {
        LoadFriends(i+1);
    });
}
LoadFriends(0);

上的代码示例

将其与示例代码放在一起：

$(document).ready(function() {
    $.ajaxSetup({cache:false});

    function LoadFriends(i) {
        var $li = $("#friendslist li:eq(" + i + ")");

        var post_id = $li.attr("id")
        $li.find(".status div").html("<img src='http://www.url.com/image.jpg'/>");
        $li.find("#replace").load("http://www.url.com/ajaxstuff",{id:post_id}, , 
            function(){
              LoadFriends(i+1);
        });
    }
    LoadFriends(0);
});

$（文档）.ready（函数（）{
$.ajaxSetup（{cache:false}）；
函数LoadFriends（i）{
var$li=$（“#友人列表li:eq（“+i+”））；
var post_id=$li.attr（“id”）
$li.find（“.status div”）.html（“”）；
$li.find（#replace”）.load（“http://www.url.com/ajaxstuff“，{id:post_id}，
函数（）{
LoadFriends（i+1）；
});
}
LoadFriends（0）；
});

而不是执行$。每个循环，您只需在

load（）

处理程序中再次递归调用函数即可

function LoadFriends(i) {
    $("#friendslist li:eq(" + i + ")").load('/echo/html/', {
        html: 'Hello!', delay: 1
    }, function() {
        LoadFriends(i+1);
    });
}
LoadFriends(0);

上的代码示例

将其与示例代码放在一起：

$(document).ready(function() {
    $.ajaxSetup({cache:false});

    function LoadFriends(i) {
        var $li = $("#friendslist li:eq(" + i + ")");

        var post_id = $li.attr("id")
        $li.find(".status div").html("<img src='http://www.url.com/image.jpg'/>");
        $li.find("#replace").load("http://www.url.com/ajaxstuff",{id:post_id}, , 
            function(){
              LoadFriends(i+1);
        });
    }
    LoadFriends(0);
});

$（文档）.ready（函数（）{
$.ajaxSetup（{cache:false}）；
函数LoadFriends（i）{
var$li=$（“#友人列表li:eq（“+i+”））；
var post_id=$li.attr（“id”）
$li.find（“.status div”）.html（“”）；
$li.find（#replace”）.load（“http://www.url.com/ajaxstuff“，{id:post_id}，
函数（）{
LoadFriends（i+1）；
});
}
LoadFriends（0）；
});

为什么不异步加载它们？加载时阻塞似乎不是一个好主意。通过使用“延迟”，我假设您的意思是使用

setTimeout

或

setInterval

；这不是“伪造”，这是JavaScript的工作方式-没有线程API可供您使用，因此您可以将任务分解成更小的部分，并使用其中一个函数来完成。ajax正在获取数据，这些数据是由我创建的一个报废程序动态收集的，此列表中可能有100多个项目，如果它们都是异步执行的，可能会使网站崩溃。每人100多个请求…每天400多人。。。可能是个坏主意。为什么不异步加载它们呢？加载时阻塞似乎不是一个好主意。通过使用“延迟”，我假设您的意思是使用

setTimeout

或

setInterval

；这不是“伪造”，这是JavaScript的工作方式-没有线程API可供您使用，因此您可以将任务分解成更小的部分，并使用其中一个函数来完成。ajax正在获取数据，这些数据是由我创建的一个报废程序动态收集的，此列表中可能有100多个项目，如果它们都是异步执行的，可能会使网站崩溃。每人100多个请求…每天400多人。。。这可能是个坏主意。如果你要获取的片段不止几个，这将冻结浏览器。“这将使浏览器在执行时不可用。”但你仍然建议这样做？我只是想帮助OP实现他的目标，如果你觉得有更好的选择，请随意给出你自己的答案。谢谢你的回答，虽然我可能不想再朝这个方向走了，因为它确实像你提到的那样冻结了浏览器。如果你有更多的片段要提取，这将冻结浏览器。“这将使浏览器在执行时不可用。”但你仍然建议这样做吗？我只是想帮助OP实现他的目标，如果你觉得有更好的选择，请随意给出你自己的答案。谢谢你的回答，尽管我可能不想再朝这个方向走了，因为它确实像你提到的那样冻结了浏览器。很酷，除了nate下面提到的，我能用这个方法吗？使用“下一步”使它更具动态性？是的，这就是它的作用。在