jquery - 多个 ajax 调用同步工作

Question

我正在使用的 Ajax 代码：

$(document).ready(function(){
        $.ajax({
            url:"load_search_list.php",
            async:true,
            beforeSend: function()
            {
                $("#loadStatus" ).html('laoding 1');
            },
            success: function(msg)
            {
                $("#loadStatus").html(msg);
                $.ajax({
                    url : 'load_search_complete_list.php',
                    async:true,
                    success: function(msg)
                    {
                        alert(msg)
                    }
                });
            }
        });
        $('input#detail').click(function(){
            $.ajax({
                url:laod_details.php,
                data:{id: $(this).val()},
                async:true,
                success: function(res)
                {
                    $('#detail'+$(this).val() ).html(res);
                }       
            });
        });
});

我正在使用下面提到的 3 个 ajax 调用 - 1. 此调用从数据库加载前 10 条记录并显示给用户 2. 在第一个 ajax 成功时，我使用此 ajax 调用从数据库加载其余详细信息。3. 这个 ajax coll 我用来加载从数据库中获取的记录的详细信息。

现在，当加载前 10 条记录时，将进行另一个 ajax 调用以加载其余记录，但与此同时，如果我尝试获取屏幕上显示的任何记录的详细信息，则仅在第二个 ajax 调用之后才执行此 ajax 调用已完成我什至尝试使用 async true 但它对我没有帮助。

Answer 1

试试这个方法。我不确定

$(document).ready(function(){
         $('input#detail').click(function(){
            $.ajax({
                url:"load_details.php",
                data:{id: $(this).val()},
                async:true,
                success: function(res)
                {
                    $('#detail'+$(this).val() ).html(res);
                }       
            });
        });

        setTimeout(function(){
        $.ajax({
            url:"load_search_list.php",
            async:true,
            beforeSend: function()
            {
                $("#loadStatus" ).html('laoding 1');
            },
            success: function(msg)
            {
                $("#loadStatus").html(msg);
                $.ajax({
                    url : 'load_search_complete_list.php'
                    async:true,
                    success: function(msg)
                    {
                        alert(msg)
                    }
                });
            }
        });
     },100);

});

Answer 2

更改laod_details.php为"load_details.php"。

laod_details由于缺少引号和拼写错误的 url 名称，请求失败（或者您更可能收到语法错误，因为它不是有效的对象名称）。如果您的 ajax 请求中没有error回调，如果服务器以错误代码响应（例如在这种情况下找不到 404），您将不会收到通知。error: function() {...}为您的请求添加一个选项。