Question

想象一下每行隐藏4个手风琴标签的表格。单击/展开行时，将触发4个Ajax调用，以将数据加载到accordion选项卡中。

标签1和标签2加载速度非常快，但3和4标签需要花费更长的时间。当展开另一行时，将触发相同的4个ajax调用。如果我最小化另一行，我想中止正在进行的特定行的ajax调用，但仍然加载新行的数据。

当你在当时正在进行一行工作时，我已经得到了这个工作，但如果我有正在进行的调用并且最小化一行并且ajax调用3和4没有为前一行完成，则这些调用也会在新扩展的行。

简化代码：

var openRows = [];
var abort = false;
var ajax1, ajax2, ajax3, ajax4;

$(document).on("click", '.details-control', function (e) {
     var id = $(this).closest('tr').attr('id');

    if ($.inArray(id, openRows) > -1) {
        openRows.splice(openRows.indexOf(id), 1);
        abort = true;
    }
    else {
        openRows.push(id);
        abort = false;
    }

    if (abort) {
        console.log("aborting AJAX");
        if (ajax1 && ajax1.readyState != 4) {
            ajax1.abort();
        }
        if (ajax2 && ajax2 .readyState != 4) {
            ajax2.abort();
        }
        etc...
    }
    else {
         ajax1 = $.ajax({
             ...
         });
         ajax2 = $.ajax({
             ...
         });
         etc...
});

所以我很容易理解为什么当我最小化另一行时正在进行的调用被中止但是我怎样才能以最佳方式解决这个问题？我是否使用带有Ajax调用的数组？或者以某种方式在ajax调用变量中包含ID？

Answer 1

您可以将ajax调用存储在由行索引映射的数组中，以便始终中止正确的调用。但是，将所有这些引用存储到所有这些行的ajax可能会导致内存泄漏。

你为什么要中止他们？

保持跟踪和处理多个Ajax调用

1 个答案: