Question

我真的不明白...我是Java语言的初学者。

我已将我的函数onLoadDocument附加到document.onload事件中。

绝对必须在function111()和function222()完成工作之后执行回调函数。

实际上，回调执行得太早，这会导致function111和function222出现问题。

仅在function111和function222完成工作后，如何执行回调函数？

function onLoadDocument(event, callback) {
    function111();
    function222();
    callback();
}

function after() {
    firstOpeningWindow = false;
}

document.onload = onLoadDocument(event, after);

Answer 1

问题在于回调是函数引用，但这行：

onLoadDocument(event, after)

是函数调用，因此可以立即运行。另外，window拥有load事件，而不是document。

function onLoadDocument(callback) {
    function111();
    function222();
    callback();
}

function after() {
    firstOpeningWindow = false;
}

// You have to supply a function reference here. So, to pass arguments
// you'd need to wrap your function invocation in another function that
// will be the callback
window.onload = function() { onLoadDocument(after) };

Answer 2

调用函数时将调用该函数，因此：

document.onload = onLoadDocument(event, after);

…立即调用onLoadDocument ，并将返回值分配给onload（这是没有意义的，因为返回值不是函数）。

如果要采用这种方法，则需要编写一个工厂，该工厂使用闭包来生成onload函数：

function onLoadDocumentFactory(callback) {
    function onLoadDocument(event) {
        function111();
        function222();
        callback();
    }
    return onLoadDocument;
}

function after() {
  firstOpeningWindow = false;
}

document.onload = onLoadDocument(after);

也就是说，使用现代的addEventListener按顺序添加功能会更容易。

function function111() {
  console.log(111);
}

function function222() {
  console.log(222);
}

function after() {
  console.log("after");
}

addEventListener("load", function111);
addEventListener("load", function222);
addEventListener("load", after);

Answer 3

问题在于window.onload（作为另一个答案的评论者说，document.onload不存在）具有一个函数，该函数在事件发生时执行。您不是在这里传递函数，而是在传递onLoadDocument(event, after)的返回值。这是undefined-要知道，浏览器正在执行该功能，对您来说还为时过早。

解决方案是让onLoadDocument返回一个函数：

function onLoadDocument(event, callback) {
    return function () {
        function111();
        function222();
        callback();
    }
}

function after() {
    firstOpeningWindow = false;
}

window.onload = onLoadDocument(event, after);

如何在Javascript加载事件中实现回调

3 个答案: