Question

我现在尝试了几个小时，但我无法让它发挥作用。请帮助！

我有2个Ajax函数，其中1将需要10秒才能完成，而另一个函数将在2 mili秒后完成。第二个功能将通过回调召回。

这两个功能都可以自行运作
第1个功能运行后，第2个功能的输出被阻止，直到第1个功能结束。

但这是不是反对异步Ajax理论？难道不可能同时运行和输出这两个功能吗？

这是JQuery：

     $('#tbut').click(function(){

        // Declare variables
        var go1 = true;
        var go2 = true;
        var z = 1;

        // Fire 1st Ajax call
        a();

        // 1st function with callback
        function a() {
            $.ajax({
                url: 't2'
            })
             .always(function() {
                console.log('t2 always');
                $('#tdiv').html(z);         // update DIV 
                z = z + 1;
                if (go1) {
                    if (go2) {
                        b();
                    }
                    setTimeout(function(){a()},2); // callback
                }
            });
        };

        // 2nd function
        function b() {
            go2 = false;
            $.ajax ({
                url: 't1'
            })
             .done(function() {
                console.log('fin');
                $('#tdiv').html('fin'); // update DIV
                go1 = false;
            });

        };

       return false;

    });

控制器操作：

   public function actionT1() {
        // make it take a little longer...
        $i=0;
        while ($i < 10) {
            $i++;
            sleep(1);
        }
        exit;
    }

    public function actionT2() {
        // do nothing here at the moment...
        exit;
    }

观点：

<button id="tbut">do something...</button>

<div id="tdiv">now</div>

Answer 1

我解决了（非常明显的问题）。我声明我的PHP函数没有正确的返回值。退出该功能与＆＃34;返回false＆＃34; 相同，因为我没有成功（）或错误（）处理程序它会导致浏览器做一些奇怪的事情（大多数情况下只是完全锁定视图）。

更新了控制器功能：

public function actionT1() {
    // make it take a little longer...
    $i=0;
    while ($i < 10) {
        $i++;
        sleep(1);
    }
    return true;
}

public function actionT2() {
    // do nothing here at the moment...
    return true;
}

和

function a() {
    $.ajax({
        url: 't2'
    })
     .always(function() {
        console.log('t2 always');
        $('#tdiv').html(z);         // update DIV 
        z = z + 1;

        if (go1) {
            if (go2) {
                b();
                go2 = false;
            }
            setTimeout(function(){a();},200); // callback
        }
    });
};

function b() {
    $.ajax({
        url: 't1'
    })
    .done(function() {
        console.log('success');
        $('#tdiv').html('this works!'); // update DIV
    })
    .error(function(data) {
        console.log('fail');
        $('#tdiv').html(data.responseText); // update DIV
    })
    .always(function(){
        go1 = false;
    });
};

为什么浏览器在进行2次Ajax调用时会锁定？

1 个答案: