javascript - 另一个异步调用的回调中的异步调用

Question

我熟悉异步 javascript 调用的细微差别。所有处理从异步调用返回的数据的工作都必须在回调中完成。收到。

在下面的代码中，我的.ajax()调用从 C# 通用处理程序中检索船员的序列化列表，并且回调包含一个.get()（也是异步的），它检索模板并将每个船员的数据与 html 模板合并，并注入它进入页面。

所有这些都可以正常工作，但是，最后，循环中的每次迭代都会完成，并且页面上插入的每个面板仅包含来自列表中最后一个工作人员的数据。

因此，我最终将页面上的所有面板都用于同一个人。列表中的最后一个人。

.get()是从 的回调中发出的.ajax()。该工作正在.done()内部的回调中执行.get()。

这应该是安全的，我想。该工作正在调用的回调中完成，.ajax()而处理该数据的工作正在..done().get()

发生的情况是循环触发所有“1 到 n”次。然后.done()回调触发“1到n”次。

我怀疑即使.get()在 for 循环中调用了，for 循环也不是异步的，并且在某个地方存在问题。

$.ajax({

    type: "POST",
    url: "js/handlers/LoadCrew.ashx",
    dataType: "text",
    cache: false,

    success: function (ajaxResult) {

        var crew = JSON.parse(ajaxResult);

        for (var i = 0; i < crew.length; i++) {

            var thisCrewMember = crew[i];
debugger;

            var getScript = $.get({
                url: "templates/CrewPanel.html",
                dataType: "text",
                data: thisCrewMember
            })

            .done(function (template) {
debugger;
                template = template.replace("[[NAME]]", thisCrewMember.NAME);
                document.getElementById("CrewPanels").innerHTML += template;
            })

            .fail(function () {
                alert("Failed to retrieve template: CrewPanel.html");
            })
        }
    },

    error: function (result) {
        return false;
    }

});

有人可以告诉我我正在尝试做的事情是否可能，如果可以，怎么做？

编辑

在代码清单中添加了两个调试器语句。

我不确定这是一个范围界定问题。在执行时，在 Chrome 调试器中，（假设来自通用处理程序的 8 行 JSON 数据），它将在第一个调试器语句上中断 8 次，然后在 done() 回调中的第二个调试器语句上中断 8 次.

当然，当它这样做时，for 循环已经完成了它的迭代，并且 thisCrewMember 位于分配的最后一个值上。

感谢您的评论，但我认为这是一个异步问题，即使我正在回调函数中进行工作。如果没有，有人可以解释问题的范围吗？

编辑 2

我把它收回。按照 PaulPro 的建议更改var为const确实可以解决问题。我想我不明白 thisCrewMember 的范围。但建议的改变带来了更好的结果。

标签： javascriptajaxasynchronous