javascript - 同时加载多个 $.ajax 调用

Question

我在从服务器获取 JSON 内容并填充三个单独 div 的页面中有 3 个 $.ajax 请求。这三个 div 中的内容非常大，因此加载所有内容需要一段时间。这些 ajax 调用也在页面加载时被调用，所以类似于：

 $(document).ready(function () {
        $.ajax({
            type: 'POST',
            url: "/controller/action",
            dataType: 'json',
            traditional: true,
            async: false,
            success: function (data) {
                //fill content in div 1
            }
        });

        $.ajax({
            type: 'POST',
            url: "/controller/action2",
            dataType: 'json',
            traditional: true,
            async: false,
            success: function (data) {
                //fill content in div 2
            }
        });

        $.ajax({
            type: 'POST',
            url: "/controller/action3",
            dataType: 'json',
            traditional: true,
            async: false,
            success: function (data) {
                //fill content in div 3
            }
        });
});

我的大问题是：

1. 如何首先加载页面（以及链接等元素）
2. 之后同时加载这三个 ajax 脚本。所以不要调用ajax1，ajax2，ajax3；它同时调用它们。

非常感谢！发条

Answer 1

1. 该页面将在 ajax 调用被触发之前加载。
2. 如果将 async 设置为 true，它们将同时触发。

Answer 2

页面将首先加载，您的函数将在准备就绪后执行。

要使GUI 响应 并同时执行 ajax 请求，请删除该async:false选项。

Answer 3

您可以将此代码移至 $(document).load( .... )。

并且 3 个呼叫将同时开始。他们的完成时间无法保证。