javascript - 当 document.ready 中的函数完成时执行 js 函数

Question

我有一个计算每台服务器性能的网站。其中一个要求是关于表演的中心部分页面必须先完成加载，然后才能在后台执行其他功能。

这个中心部分页面使用ajax 调用。它们在 js 文件的 document.ready 中定义:

$(document).ready(function () {
// ajax call here
// another ajax call here
// third ajax call here
});

然后文档里面的函数ready完成后我想执行的函数:

function functionA() {
// some codes here
});

我试过用这个:

$.when(document).ready(function () {
}).done(functionA);

但我无法让它运行.. 任何建议将不胜感激。提前致谢!

Answer 1

AJAX 中的第一个字母代表异步，这意味着在您的document.ready 事件结束时，它们可能会在其他地方进行一些处理。 document.ready 不会等待它们完成。

您需要使用 .when 设置 jQuery告诉您所有三个 AJAX 调用何时完成:

// Document.ready
$(function() {
    // Any synchronous code you may do on DOM ready goes here

    // Set up the promise
    $.when(
        // Pass in all your AJAX calls.
        $.ajax({ url: "/AjaxCall1?param=true" }),
        $.ajax({ url: "/AjaxCall2?param=1" }),
        $.ajax({ url: "/AjaxCall3?param=yup" })
    ).then(function() {
        console.log("All AJAX requests finished");
    }, function() {
        console.log("Something went wrong :(");
    });
});