如何延迟 ajax 调用几秒

Question

我不确定这是为 facebook api 发送 2 ajax 的最佳方式。但它有效，问题是有时我在第一个 (result.php) 之前得到第二个 ajax (result_flow.php) 将有助于延迟秒 ajax (url:result_flow.php) 3 秒或以某种方式更改此代码以发出命令。

我尝试了 setTimeout 但没有成功。

$('#sub').click(function () {
    var data = $("input#dataInput").val();
    console.log(data);
    var total = $("input#totalInput").val();
    var subscriber_id = $("input#subscriber_id").val();
    var res_name = $("input#res_name").val();
    var dataString = 'data='+ data + '&total=' + total + '&subscriber_id=' + subscriber_id+ '&res_name=' + res_name;
    console.log(dataString);
    $.ajax({
        type: "POST",
        url: "result.php",
        data: dataString,
        success: function(data) {
            console.log(data);
           if(data==='success'){
               //localStorage.clear();
                   MessengerExtensions.requestCloseBrowser(function success() {
                       console.log("Webview closing");
                   }, function error(err) {
                       console.log(err);
                   });
                            }
        }
    });
    $.ajax({
        type: "POST",
        url: "result_flow.php",
        data: dataString,
        success: function(data) {
        setTimeout(function(){
            console.log(data);
           if(data==='success'){
                            }
        },3000);
      }
    });
}

Answer 1

首先，setTimeout() 不起作用，因为您将它放在回调中，这意味着它将在请求完成后执行。无论如何，这不是处理此类任务的正确方法，您应该将第二个请求放在第一个请求的回调中，以便它会在第一个请求完成时执行。
代码如下所示：

$('#sub').click(function() {
    var data = $("input#dataInput").val();
    console.log(data);
    var total = $("input#totalInput").val();
    var subscriber_id = $("input#subscriber_id").val();
    var res_name = $("input#res_name").val();
    var dataString = 'data=' + data + '&total=' + total + '&subscriber_id=' + subscriber_id + '&res_name=' + res_name;
    console.log(dataString);
    $.ajax({
        type: "POST",
        url: "result.php",
        data: dataString,
        success: function(data) {
            console.log(data);
            if (data === 'success') {
                //localStorage.clear();
                MessengerExtensions.requestCloseBrowser(function success() {
                    console.log("Webview closing");
                }, function error(err) {
                    console.log(err);
                });

                $.ajax({
                    type: "POST",
                    url: "result_flow.php",
                    data: dataString,
                    success: function(data) {
                        console.log(data);
                    }   
                });
            }      
        }
    });
}

请注意，在我的代码中，只有在第一个请求成功时才会发送第二个请求，因为它位于 if (data === 'success') {...} 语句中。

Answer 2

你应该在链中调用它们。 成功...然后...使用 promise 是最好的方法。

如果订单不是您明确写的，请不要相信您收到的订单。

JQuery Ajax

Deprecation Notice: The jqXHR.success(), jqXHR.error(), and jqXHR.complete() 
callbacks are removed as of jQuery 3.0. You can use jqXHR.done(), jqXHR.fail(), 
and jqXHR.always() instead.

你可以这样做：

// First Ajax call
$.ajax({
  // Do the request
  // Remove success to use new promise
})
.done(function( data ) {
    // Add the success here
    // Add the Second Ajax call here or create a function to call it, whatever you want
});

Answer 3

我现在建议使用 async/await，使用 AJAX 顺序调用非常容易：

$('#sub').click(async () => {
    ...
    try {
        let data = await $.post({
            url: "result.php",
            data: dataString
        });
        if (data === 'success') {
            ...
        }
        data = await $.post({
            url: "result_flow.php",
            data: dataString
        });
        if (data === 'success') {
            ...
        }
    } catch (err) {
        console.log(err);
    }
});

未测试，因为我不使用 jQuery - 但它应该会给你想法。由于 $.ajax/$.post 支持 Promises，它应该与 async/await 一起工作。请注意，您可能需要使用 Babel 为旧版浏览器转译代码，但我还是建议使用 Babel。

如果要同时使用两个 AJAX 调用，请使用 Promise.all（因为它们不相互依赖）- 结果将按顺序排列，因此您可以确保按顺序调用回调代码。

如何延迟 ajax 调用几秒

How delay ajax call by few seconds

php

ajax

facebook

facebook-messenger