返回false，不取消每个循环答案

【问题标题】：Return false, not cancelling for each loop返回false，不取消每个循环
【发布时间】：2016-03-24 02:17:52
【问题描述】：

我正在使用函数 showVisible() 从 googlemap 收集所有标记 ID，将它们传递给数组，然后使用 AJAX 从服务器调用相应的对象数据。

只要有人点击地图上的标记集群，就会触发此事件。如果有人在进行所有 ajax 调用之前单击标记，我需要停止循环遍历数组。

我尝试使用 if 语句，以便如果 breakAjax 为“true”，则循环应返回 false。尽管我可以在控制台上看到变量变为 true，但它并没有触发中断。

函数的完整代码如下：

function showVisible() {
  visRunning = true
  console.log('show visible')

  $('#objects_list').empty()

  function unique(list) {
    var result = [];
    $.each(list, function(i, e) {
      if ($.inArray(e, result) == -1) result.push(e);
    });
    return result;
  }

  scoots = unique(locStr)
  totalScoots = scoots.length
    //console.log('total scoots ' + totalScoots);
  var scootOutput = 0

  for (var i = 0; i < scoots.length; i++) {
    if (scootOutput === 0) {
      $('#objects_list').empty()
    }
    console.log('breakAjax: ' + breakAjax)

    countManager()


    $.ajax({
      url: 'https://scootapi.stuffstory.com/api/stuff/' + scoots[i],
      dataType: 'json',
      type: "get",
      success: function(stuffData, textStatus, jqXHR) {

        $('#objects_list').append('<a class="stuff_wrapper" target="_blank" onclick="ga("send", "event", "grid view scooter ' + stuffData.id + '", "click", "frontPage")" href="../scooter/?view=' + stuffData.id + '"><div class="stuff_holder" style="background-image:url(' + stuffData.image + '/convert?w=250&h=250);"><div class="scooter_title_sm"><div class="title_wrapper"><div class="scooter_title_1 cursive_sm">' + stuffData.make + '</div><div class="scooter_title_2 lato_sm">' + stuffData.model + '</div><div class="scooter_title_3 cursive_sm">' + stuffData.year + '</div></div></div></div></a>')
        console.log('breakAjax: ' + breakAjax)
        stuffSizer()
        scootOutput++
        if (scootOutput === totalScoots) {
          visRunning = false
        }
      },
      error: function(data, textStatus, jqXHR) {}
    })

    if (breakAjax === "true") {
      return false;
    }

  };
}

【问题讨论】：

breakAjax 是布尔值吗？如果是这样，if (breakAjax === "true") 应该是if (breakAjax === true)吗？
糟糕。它最初是，然后我更改它只是为了测试，然后再发布到这里。我会把它改回来，但它似乎没有任何区别。
我没有看到任何代码为 breakAjax 赋值，那么它怎么可能是 true 或“true”？
也取消一个循环，打破它，你应该使用，break;。如果使用例如 jQuery foreach，你应该使用，return false;.
Quentin - 在页面的其他地方有一个地图集群点击处理程序来分配值。 google.maps.event.addListener(markerClusterer, 'click', function(c) { if (visRunning === true){ breakAjax = "true" }

标签： javascript jquery ajax for-loop

【解决方案1】：

breakAjax 的值在循环内不会改变。

JavaScript 是单线程的。

不在循环内的代码在循环运行时无法更改该变量的值（无论如何这几乎是瞬间发生的）。

您似乎忘记了 Ajax 中的 A 代表异步。

您正在遍历循环，发出 n 个 HTTP 请求并设置 n 个事件处理程序（成功函数），该处理程序将在 得到 HTTP 响应时运行 事件触发。

如果你想阻止success函数对数据做任何事情，那么你需要在success函数内部测试breakAjax。

此时停止发送 HTTP 请求为时已晚。如果这是目标，那么您将需要重构您的逻辑（可能使用递归函数），以便您的循环由success 处理程序而不是使用for 递增。

【讨论】：

很好解释。谢谢