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

Hi I'm calling this function:

嗨,我正在调用此函数:

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;
}

like this:

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

So when you click .caller it calls the function gets the data correctly populates the array, but console.log(getCoordenadas()); outputs [].

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

If I move the array declaration (var coordenadas = new Array();) from the function scope to make it global, when I click .caller for the first time console.log(getCoordenadas()); outputs [], but the second time it outputs the array correctly. Any ideas?

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

Thanks in advance

提前致谢

2 个解决方案

#1

This function works asynchronously. AJAX post is fired and then function returns without waiting for AJAX call to complete. That's why coordenadas array is empty.

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

When you make it global, the first time it's still empty and by the second time you try, the ajax returned and populated the array. You should restructure your code to use a callback. Something like this:

当你把它设为全局时,第一次它仍然是空的,并且第二次你尝试时,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);
      })
    });
});

#2

If you need a complete function, you can't use $.post functions;

如果你需要一个完整的函数,你不能使用$ .post函数;

you will need to call the $.ajax function directly. You pass an options object that can have "success", "error" and "complete" callbacks.

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

Instead of this:

而不是这个:

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

you would use this:

你会用这个:

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

});

There are lots of other options available too. The documentation lists all the options available.

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

#1