Question

我有一个内部带有ajax函数的jQuery每个循环，但是在循环仍在运行时尝试从该页面导航时遇到一个问题，除非每个循环，否则我基本上无法导航到任何其他页面已经结束。

我不需要完成此循环，因为基本上只需要将其用作视觉指示器，而为此牺牲用户体验就没有那么重要了。

    $.each( get_link, function( i, val ) {

    $(window).on("beforeunload", function() {
        return false;
    });

    $.ajax({
        type: "POST",
        url: url,
        async: true,
        data: {url: val},
        success: function(data)
        {
            let row = $("#status[data-url='" + val + "']");
            row.html(data);
            $("#loader[data-url='" + val + "']").removeClass("loader vertical-align-middle loader-bounce");
        }
    });
});

如您所见，我尝试使用$(window).on("beforeunload")进行修复，但是beforeunload创建了一个不必要的警报窗口，不幸的是我找不到禁用方法。

编辑：上面的代码也没有打破循环……

beforeunload是个好主意吗？也许有更好的方法可以打破页面退出循环？

f.khantsis建议中止ajax操作，这是一个好主意，但这无济于事，因为我在具有5-6个键的数组上运行了每个循环。因此，如果其中之一被中止，则循环将继续使用其余所有键运行。

Answer 1

请参阅Abort Ajax requests using jQuery

基本上，jQuery.ajax返回一个jqXHR对象，该对象可用于中止待处理的请求。

$.each( get_link, function( i, val ) {

    var xhr = $.ajax({
      type: "POST",
      url: url,
      async: true,
      data: {url: val},
      success: function(data)
      {
          let row = $("#status[data-url='" + val + "']");
          row.html(data);
          $("#loader[data-url='" + val + "']").removeClass("loader vertical-align-middle loader-bounce");
      }
    });
    $(window).on("beforeunload", function() {
      xhr.abort();
    });
});

Answer 2

$(window).on("beforeunload")应该在循环之外。

然后，它可以设置一个全局变量，然后在循环中检查该变量，例如：

var leavingThePage = false;

$(window).on("beforeunload", function() {
        leavingThePage = true;
});

$.each( get_link, function( i, val ) {
    if (leavingThePage)
        return false;

    $.ajax({
      ... Do ajax stuff ...
    });
});

jQuery打破页面上的每个循环卸载

2 个答案: