jQuery异步ajax查询和返回值问题（范围，闭包）

Question

由于异步查询和变量范围问题，代码无法正常工作。我无法理解如何解决这个问题。使用async更改为$ .ajax方法：false - 不是选项。我知道关闭，但我如何在这里实现它 - 不知道。我在这里看到了关于js和jQuery异步问题中的闭包的所有主题 - 但仍然没有。请帮忙。 这是代码：

var map = null;
var marker;
var cluster = null;

function refreshMap() 
{
    var markers = [];  
    var markerImage = new google.maps.MarkerImage('/images/image-1_32_t.png', new google.maps.Size(32, 32));

    $.get('/get_users.php',{},function(data){
        if(data.status == 'error')
            return false;

        var users = data.users; // here users.length = 1 - this is ok;  
        for(var i in users)
        {
            //here I have every values from users - ok
            var latLng = new google.maps.LatLng(users[i].lat, users[i].lng);
            var mark = new google.maps.Marker({
                position: latLng,
                icon: markerImage
         });

             markers.push(mark);
             alert(markers.length); // length 1
        }

    },'json');

    alert(markers.length); // length 0  
    //if I have alert() above - I get result

    cluster = new MarkerClusterer(map, markers, 
    {
        maxZoom: null,
        gridSize: null
    });
}

感谢。

Answer 1

只需移动此代码：

cluster = new MarkerClusterer(map, markers, 
{
    maxZoom: null,
    gridSize: null
});

进入回调函数（第一个警报的位置）

问题是，对于异步请求，即使请求尚未完成，代码也将继续执行。因此，在执行匿名回调函数之前，您的markers变量设置不正确。

Answer 2

必须处理markers的所有代码都必须在您的回调函数中。这行代码：

alert(markers.length); // length 0  

在 Ajax调用返回之前（即在执行回调之前）

执行。

---

这意味着您的代码应该更像这样：

$.get('/get_users.php',{},function(data){
    if(data.status == 'error')
        return false;

    var users = data.users; // here users.length = 1 - this is ok;  
    for(var i in users)
    {
        //here I have every values from users - ok
        var latLng = new google.maps.LatLng(users[i].lat, users[i].lng);
        var mark = new google.maps.Marker({
            position: latLng,
            icon: markerImage
         });

         markers.push(mark);
         alert(markers.length); // length 1

         cluster = new MarkerClusterer(map, markers, 
                   {
                           maxZoom: null,
                           gridSize: null
                   });

         // more with cluster here
     }
},'json');

如果在Ajax回调中设置或更改变量，请不要依赖回调之外的值。