javascript - JQuery，AJAX : How can I populate an array with a json return?

Question

我正在尝试遵循代码，但只在警告框中显示“未定义”。任何人都知道我如何实际填充 .ajax 之外的数组？

$(document).ready(function() {

    var reviewArray = new Array();

    getReviews();

    alert(reviewArray[0]);

});

function getReviews()
{

   $.ajax({
    type : 'GET',
    url  : 'reviewbox.php',
    dataType : 'json',
    success  : function ( data ) {

    $.each( data.reviews, function( i, itemData ) {
       reviewArray[i] = itemData.review;
    });
    },
    error    : function ( XMLHttpRequest, textStatus, errorThrown) {
        var err = "An error has occured: " + errorThrown;
        $("body").append(err);
        }
    });

}

Answer 1

你有两个问题:

1. Ajax 调用是异步的。 alert执行时，数组还没有填满(Ajax调用还没有返回)。
2. 数组 reviewArray 不在 getReviews 的任何(父)范围内(即无法从该函数访问)。

将 alert 放入回调中:

$(document).ready(function() {  
    getReviews(function(reviewArray) {
         alert(reviewArray[0]);
    }); 
});

function getReviews(callback) {
    $.ajax({
        /*...*/
        success  : function (data) {
            var reviewArray = [];
            $.each( data.reviews, function( i, itemData ) {
               reviewArray[i] = itemData.review;
            });
            callback(reviewArray);
        },
        /*...*/
   });
}

如果你想通过预先声明 reviewArray 来做到这一点，你还必须在 ready 回调中定义 getReviews:

$(document).ready(function() {  
    var reviewArray = [];

    getReviews(function() {
         alert(reviewArray[0]);
    });

    function getReviews(callback) {
        $.ajax({
            /*...*/
            success  : function (data) {
                $.each( data.reviews, function( i, itemData ) {
                   reviewArray[i] = itemData.review;
                });
                callback();
            },
            /*...*/
       });
    }
}); 

但这样一来，您的应用程序的实际流程可能会更加困惑。