jQuery .push 到 .get 调用中的数组给出了一个空的结果

Question

谁能告诉我为什么下面给了我一个空字符串？当我在$.get() 回调函数中console.log(contentArray) 时，它会显示数据，但是当我尝试在下面代码中的位置执行此操作时，结果为空。

sectionArray = [];
contentArray = [];
$(function () {
    if (index == 1) {
        $('menu:eq(' + (section - 1) + ') li a').each(function () {
            sectionArray.push($(this).attr('href'));
        });

        var len = sectionArray.length;

        for (var i = 0; i < len; i++) {
            href2 = sectionArray[i];

            $.get(href2, function (data) {
                string = data.toString();
                contentArray.push(string);
            });
        }
        content = contentArray.toString();
        console.log(content);
    }

Answer 1

因为 ajax 请求在您调用 console.log() 后结束，请尝试以下操作：

$.get(href2, function(data){
    string = data.toString();
    contentArray.push(string);
    content = contentArray.toString();
    console.log(content);
});

在循环中也做 ajax 请求不是最好的事情。这不会像你想要的那样工作。

更新：

jQuery 也将 async 选项设置为 false，您的代码应该可以运行，但运行速度会很慢。同步请求可能会暂时锁定浏览器。

更新 2

也许可以尝试这样的事情（也许不是个好主意：D）：

var countRequests = len;
$.get(href2, function(data){
    string = data.toString();
    contentArray.push(string);
    countRequests = countRequests - 1;
    if (countRequests == 0) {
        content = contentArray.toString();
        console.log(content);
        // or create callback
    }
});

Answer 2

问题在于您的$.get() ajax 请求是异步执行的。

也就是说，$.get() 函数在不等待响应的情况下立即返回，你的整个 for 循环完成（排队多个 ajax 请求），然后你的 console.log() 发生在数组的哪个点仍然是空的。只有在那之后，才会调用任何 ajax 成功处理程序，无论 ajax 响应返回多快。

编辑：这是另一个问题的答案，显示了在所有 ajax 调用完成后如何做某事：https://stackoverflow.com/a/6250103/615754