在此 AJAX 調用循環上設置延遲

Question

我在我的 AJAX 調用中收到一個錯誤，似乎我每次循環第二個 ajax 調用時都需要設置延遲。 但我不能讓它工作。

這是我的第一個 ajax 調用，在這個 ajax 調用中有一個 jquery，每個循環調用第二個 ajax 調用。 我添加了 setTimeout 函數，但我仍然在控制台上收到錯誤消息“Uncaught RangeError: Maximum call stack size exceeded”

$.ajax({
            url: mysite.ajax_url,
            type: 'POST',
            data: {
                'action': 'test_ajax_function',
                'user_input': user_input_last
            },
            success:function(data) {
                $(".container").css("opacity", 1);
                $("#loading-img").css({"display": "none"});

                var array_data = data.split("||");

                var items_count = array_data[0];
                var items = array_data[1];



                jQuery.each(JSON.parse(items), function() {

                setTimeout(function(){    
                getItemDetails(this);
                }, 3000);

                });



            },
            error: function(errorThrown){
                console.log(errorThrown);
            }
        }); 

這是第二個 ajax 調用。

function getItemDetails(id) {

    var item_id = id;

        $.ajax({
            url: mysite.ajax_url,
            type: 'POST',
            data: {
                'action': 'getItem',
                'id': item_id
            },
            success:function(data) {

            console.log(data);

            },
            error: function(errorThrown){
                console.log(errorThrown);
            }
        });    

}    


});

Answer 1

在您的第一個 ajax 調用中，不要this作為參數傳遞給getItemDetails ，這就是導致您出錯的原因。

因為似乎getItemDetails期望參數是項目的 ID，只需執行以下操作：

jQuery.each(JSON.parse(items), function(index, item) {
    getItemDetails(item.id);  //<------ I'm assuming 'id' is the name of the property
});