Question

我通过封装在for循环中发出多个ajax请求：

for(var o = 1; o <= 2; o++)
                {
                    $.ajax({
                        type: 'GET',
                        url: 'lib/terrain.php',
                        dataType: 'html',
                        data: {o: o},
                        success: function(data) {
                            var objectRuta = Math.floor((Math.random() * 100) + 1); //Slumpar tal mellan 1 & 100
                            angular.element('.click#'+objectRuta).addClass('object').html($("<img src='images/potion.png' title='"+data+"'>"));
                            console.log(data);
                        },
                        error: function(xhr, ajaxOptions, thrownError) { alert(thrownError); }
                    });
                    k=o;                
                }

从我的后端获取有关不同对象的信息：

if(isset($_GET['o']))
{
    $object_query = mysql_query("SELECT * FROM objects");
    $objects = array();
    while($object_row = mysql_fetch_row($object_query))
    {
        $objects[] = $object_row;   //Information about objects
    }

    $count_objects = count($objects);   //Count how many objects it is
    $slump_objects = rand(1, $count_objects);   //Sell of which objects that shoul be viewd at the map.

    var_dump($objects[$slump_objects]);
}

正如你所看到的，我两次向我的后端发出ajax调用。我遇到的问题是，有时它只从我的后端获得一个值，而不是两个。有时它会获得两个值，这是正确的。问题是，有时它只获得一个值，另一个值为NULL。

为什么？

Answer 1

由于ajax是异步的，你的循环会立即完成，而你应该使你的ajax函数递归，从完成的回调调用它自己：

function doAjax(){
    var total = 2;
    var counter = 0;

    function recursiveAjax(){

        $.ajax({
            //...
            done:function(){
                counter++;
                //call again
                if(counter < total) recursiveAjax();
            }
        });
    }

    //call the first time
    recursiveAjax();
}

Answer 2

错误在您的PHP代码中：

$slump_objects = rand(1, $count_objects);   //Sell of which objects that shoul be viewd at the map.

var_dump($objects[$slump_objects]);

如果$slump_objects的值等于$count_objects（数组大小），则var_dump($objects[$slump_objects])会返回NULL。

PHP数组从索引0开始，最后一个索引是($count_objects-1)，因此将其中一个语句更改为：

 $slump_objects = rand(0, $count_objects-1);

或

 var_dump($objects[$slump_objects-1]);

Answer 3

以下是使用done()进行第二次通话的示例 - http://api.jquery.com/jquery.ajax/

$.ajax({
    type: 'GET',
    url: 'lib/terrain.php',
    dataType: 'html',
    data: {o: 1},
}).done(function(data) {
    var objectRuta = Math.floor((Math.random() * 100) + 1); //Slumpar tal mellan 1 & 100
    angular.element('.click#'+objectRuta).addClass('object').html($("<img src='images/potion.png' title='"+data+"'>"));
    console.log(data);
    $.ajax({
        type: 'GET',
        url: 'lib/terrain.php',
        dataType: 'html',
        data: {o: 2},
    }).done(function(data) {
        var objectRuta = Math.floor((Math.random() * 100) + 1); //Slumpar tal mellan 1 & 100
        angular.element('.click#'+objectRuta).addClass('object').html($("<img src='images/potion.png' title='"+data+"'>"));
        console.log(data);
    }).fail(function() {
        function(xhr, ajaxOptions, thrownError) { alert(thrownError); }
    })
}).fail(function() {
    function(xhr, ajaxOptions, thrownError) { alert(thrownError); }
});

当然，这可以做得更整齐，这只是为了让你了解这项技术。

Answer 4

在这里，您正在进行异步调用，这意味着您的循环会在执行第二次调用之前等待第一次调用完成。并且一些浏览器忽略对完全相同的URL的并行Ajax调用。因此，您只需附加循环计数值即可尝试更改网址。

for(var o = 1; o <= 2; o++)
{
    $.ajax({
        type: 'GET',
        url: 'lib/terrain.php?count='+o,
        dataType: 'html',
        data: {o: 1},
    }).done(function(data) {
        var objectRuta = Math.floor((Math.random() * 100) + 1); //Slumpar tal mellan 1 & 100
        angular.element('.click#'+objectRuta).addClass('object').html($("<img src='images/potion.png' title='"+data+"'>"));
        console.log(data);    
    }).fail(function() {
        function(xhr, ajaxOptions, thrownError) { alert('Error:'+thrownError); }
    });
}

多个ajax请求

4 个答案: