从jQuery.post AJAX调用返回数据?

时间:2012-03-28 10:55:03

标签: javascript jquery ajax arrays return

您好我正在调用此功能:

function getCoordenadas()
{
    var coordenadas = new Array();
    $.post(
        '<?=$this->baseUrl('user/parse-kml')?>', 
        { kmlName: "esta_chica.kml"},
        function(jsonCoord) {
            jQuery.each(jsonCoord, function(i, val) {
                var latlng = val.split(',');
                coordenadas.push(new google.maps.LatLng(latlng[0], latlng[1]));
            });
        },
        'json'
    );  
    return coordenadas;
}
像这样:

$(document).ready(function(){
    $('.caller').click(function() {
        console.log(getCoordenadas());
    });
});

所以当你单击.caller时它调用函数获取数据正确填充数组,但是console.log(getCoordenadas());输出[]。

如果我从函数范围移动数组声明(var coordenadas = new Array();)使其成为全局,当我第一次单击.caller时,console.log(getCoordenadas());输出[],但第二次正确输出数组。有什么想法吗?

提前致谢

2 个答案:

答案 0 :(得分:3)

此功能异步工作。 AJAX帖子被触发,然后函数返回而不等待AJAX​​调用完成。这就是coordenadas数组为空的原因。

当你把它设为全局时,第一次它仍然是空的,第二次你尝试时,ajax返回并填充数组。您应该重新构建代码以使用回调。像这样:

// definition
function getCoordenadas(callback)
{
    var coordenadas = new Array();
    $.post(
        '<?=$this->baseUrl('user/parse-kml')?>', 
        { kmlName: "esta_chica.kml"},
        function(jsonCoord) {
            jQuery.each(jsonCoord, function(i, val) {
                var latlng = val.split(',');
                coordenadas.push(new google.maps.LatLng(latlng[0], latlng[1]));
            });
            callback(coordenadas);
        },
        'json'
    );  
}

// usage
$(document).ready(function(){
    $('.caller').click(function() {
      getCoordenadas(function(coord) {
        console.log(coord);
      })
    });
});

答案 1 :(得分:1)

如果您需要完整的功能,则无法使用$.post功能;

您需要直接调用$.ajax函数。 您传递的选项对象可以包含“成功”,“错误”和“完成”回调。

而不是:

$.post(<?=$this->baseUrl('user/parse-kml')?>, parameters, function);

你会用这个:

$.ajax({
    url: <?=$this->baseUrl('user/parse-kml')?>,
    type: "POST",
    data: parameters,
    success: successFunction,
    error: errorFunction,
    complete: completefunction

});

还有很多其他选择。 The documentation列出了所有可用选项。