Question

我有一个each（）函数，以反向（lol）迭代多个tr元素。

<table>
    <tr><th>header row</th></tr>
    <tr><td id="row1">row 1</td></tr>
    <tr><td id="row2">row 2</td></tr>
    <tr><td id="row3">row 3</td></tr>
</table>

$($("table tr:gt(0)").get().reverse()).each(function() {
     tr=$(this);
     console.log(tr); // correctly prints my TRs in reverse order
}

效果很好，但现在看：

$($("table tr:gt(0)").get().reverse()).each(function() {
    tr=$(this);
    console.log(tr); // correctly prints my TRs in reverse order
    $.ajax({
         type: "POST",
         url: "ajax.php",
         data: data,
         dataType: "json",
         success: function(json) {
             console.log(tr); // incorrectly prints TRs in not-reverse order
             // TRs are not matched with above. Chaos ensues.
         }
    });
});

我认为正在发生的事情是Ajax调用执行的时间比TR元素的迭代时间长......我想我可以将async设置为false，但是是有的一种保持这种异步的方法吗？

解

正如@Nicola在下面指出的那样，最好只将ID与Ajax调用一起发送到服务器，并在成功函数中再次检索它。

Answer 1

这是因为你为每个<tr>触发一个ajax调用，并且由于调用是异步的，你无法保证它们将按顺序返回，这意味着第二次调用在第一次调用之后被触发没有等待回应就被解雇了。将async设置为false可以解决问题，如果你想保持“异步”，你应该在成功回调中触发第二个调用，但你的迭代不会等待，所以你需要重构一切

jQuery each（）和多个Ajax调用 - Ajax中的元素与迭代中的父元素不匹配

1 个答案: