Question

我读了页面上的所有<li>，通过Ajax向其他页面提交请求。都很好。

我遇到的唯一问题是在请求重新出现后更新<li>。在$.get之外，$li或$(this)是当前<li>。在$.get内，$li始终是页面上的最后一个<li>，这是我的问题。

//For each <li>
$('ul#clients li').each(function(index) {
    $li = $(this);
    $li.append('This is ok');

    //Update Data via Ajax
    $.get("/ajax-update.php", function(data) {  $li.append('This is not OK!'); });

}

Answer 1

使用var ...如果没有var前缀，将在声明$li的最近父作用域定义变量。如果从未声明$li，则将在全局（window）范围内定义它。

//For each <li>
$('ul#clients li').each(function(index) {
    var $li = $(this);
    $li.append('This is ok');

    //Update Data via Ajax
    $.get("/ajax-update.php", function(data) {  $li.append('This is not OK!'); });

}

Answer 2

这里的问题是$ .get是异步的。这意味着它在一个单独的线程上运行。所以在该线程完成之前，它已经通过其他li并且每次更改$ li变量。

所以当所有的$ .get都返回最后一个$ li时，这就是为什么你只看到最后一个li的变化。

我认为您可以使用var。这应该将变量的范围限制为当前循环并解决问题。

否则，您可能需要在每个变量之外包含一个count变量，并使用数组来存储li对象。如果您需要更多信息，请告诉我。

Answer 3

您可以使用context参数指定回调的上下文。请注意，这仅适用于ajax方法，而不适用于get，但结果相同

$('ul#clients li').each(function(index) {
  $li = $(this);
  $li.append('This is ok');

  $.ajax({
    url: "/ajax-update.php",
    context: this,
    success: function(){
      $(this).append('This is not OK!');
    }
  });
}

Answer 4

以下是您的问题示例和评论如何解决问题：http://jsfiddle.net/Akkuma/AJnR4/

发生的事情是您的$li是在全球范围内创建的。由于$.get是异步的，因此$li的值设置为第一个$.get甚至返回到成功函数之前的最后一个值。你可以认为这是一种竞争条件。如果$.get如此之快以至于它在循环的下一次迭代之前执行，那么您实际上看不到存在这个问题。

正如评论所示，简单的解决方案是将$li更改为var $li，以确保其范围正确。

在jquery中$ .get之后丢失选择器

4 个答案: