Question

我有一个页面必须运行几次ajax命令。它必须使用前一个ajax调用的结果作为当前的结果。

在外行人的条件下：

调用ajax，在远程服务器上构建实体，返回结果（我得到一个专有的id作为结果） ...

调用ajax，使用result将其他数据发布到远程服务器，获取此帖子的id ...

调用ajax，发布ids..etc

我的第一个想法是async：false，但我发现这是非常不可接受的，它会破坏代码执行顺序。我的目标也是建立一个对话窗口，在它们发生时打印ajax调用的结果。目前，一旦完成所有ajax调用，就会出现对话框窗口。我不会得到漂亮的小东西：构建....然后完成其他选项.....完成等等......

如果我做asynch：是的，我不会有id需要处理下一个ajax ..

我还有其他选择吗？

//form var is set earlier, standard serialized form.

  var functions = ['build','additionalOptions','completion'];

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

    $('#createGroupDialog').dialog({
        autoOpen:false,
        width: 1200,
        height:800,

        modal: true,
        position: {my: "top", at: "top"},
        resizable: false,
        closeOnEscape: true
       });

    $("#createGroupDialog").dialog('open').html("<p>Please Wait...</p>");

   function fireAjax(form,func)
    {
        $.ajax({
            type: "POST",
            url: "createGroup/createGroupDo.php",
            data: form+"&func="+func,
            asynch: false,
            success: function (result) {
                            $('#createGroupDialog').append(result);
            }
            });
    }

    jQuery.each(functions , function(i,func){
            fireAjax(form,func);
    });

});

Answer 1

asynch:false确实是一种处理异步数据的可怕方法。它不会破坏执行顺序，但它会阻止直到请求完成意味着其他JavaScript无法同时运行，这包括onclick处理程序和动画等内容。

由于您的请求依赖于之前的请求，您必须按照以下方式编写请求：

$.ajax({
    url: "request1.php",
    data: data,
    success: function (result_1) {
        $.ajax({
            url: "request2.php",
            data: result_1,
            success: function (result_2) {
                $.ajax({
                    url: "request3.php",
                    data: result_2,
                    success: function () {}
                });
            });
        }); 
    }
});

但是你可以看到这很乏味。你可以使用回调，但最好使用Promise API。

使用类似：

$.ajax({
    url: "request1.php",
    data: data
}).then(function (result_1) {
    alert(result_1);
    return $.ajax({
        url: "request2.php",
        data: result_1,
    }); 
}).then(function (result_2) {
    alert(result_2);
    return $.ajax({
        url: "request3.php",
        data: result_2
    });
}).then(function (result_3) {
    alert(result_3);
});

值得注意的是，jQuery做了很多工作，以使这个API成为可能。 $.ajax是一个非常灵活的功能。这意味着您可以通过多种方式使用它。最好选择一种方式并坚持下去。目前的艺术状态真正倾向于Promises。

jquery多个ajax调用而不使用async false

1 个答案: