Question

我有几个函数应该在onload事件延迟一段时间后触发。它在Chrome中运行良好，但在Firefox中不行。

function foo() {
    // javascript code
}

window.onload = setTimeout(foo, delay);

function bar() {
    // javascript code
}

window.onload = setTimeout(bar, delay);

如果我删除延迟，则在Firefox中调用'bar'，并在chrome中调用'foo'和'bar'。这可能是什么问题？

Answer 1

我很惊讶在任何浏览器中调用这两个函数。但是你可能会有更好的运气：

function foo() {
    // javascript code
    setTimeout(bar, additionalDelay);
}

function bar() {
    // javascript code
}

window.onload = function() { setTimeout(foo, delay); };

编辑：没关系，我明白为什么两个超时都会执行。当你做类似的事情时：

window.onload = setTimeout(bar, delay);

...您实际上并没有设置window.onload来延迟后执行您的功能。相反，这会立即调用setTimeout()来安排函数调用，并将结果（调度函数调用的句柄）分配给window.onload。这是不正确的，并且在尝试将window.onload作为函数调用时，可能会在某些浏览器中导致运行时错误。

您想要做的是将功能分配给window.onload，例如：

window.onload = function() { 
    setTimeout(foo, delay); 
    setTimeout(bar, delay);
};

Answer 2

你可以像这样使用jQuery：

$(document).ready(function() { /* your code */ });

或

$(window).load(function() { /* your code */ });

jQuery会自动将函数添加到堆栈中，并在触发事件后全部运行它们。

如果你只想用JS做，你可以使一系列函数触发：

function a() {
        alert('a');
    }

    function b() {
        alert('b');
    }

    var arr = new Array(a, b);

    window.onload = function() {
        for(var i = 0; i < arr.length; i++) {
            setTimeout(arr[i], 1000);
        }
    }

希望它有所帮助。

Answer 3

尝试在函数中包装超时：

window.onload = function(delay) {
                  setTimeout(foo, delay); 
                  setTimeout(bar, delay); 
                };

Answer 4

我可以在您的代码中看到两个基本错误。首先，如果要将函数作为参数传递，则需要编写不带括号的函数名;如果你添加括号，那么函数将执行然后。查看示例：

function foo(){
    alert("I am foo");
}
function bar(){
    alert("I am bar");
}

setTimeout(foo, 5000);
setTimeout(bar(), 10000);

其次，如果您使用.onload运算符为=属性分配值，则会覆盖其先前的值，就像a = 3覆盖之前a的值一样}。

function foo(){
    alert("I am foo");
}
function bar(){
    alert("I am bar");
}
window.onload = foo;
window.onload = bar;

据我所知，您的主要问题是能够添加而不是替换事件处理程序。像往常一样，没有可以在所有浏览器中安全使用的通用API。如果您使用的是框架或库，它可能会提供跨浏览器机制。否则，您需要找到或写自己的。在过去，我在几个项目中使用过它：

http://dean.edwards.name/weblog/2005/10/add-event2/

...虽然它自2005年以来没有更新过，所以我确保它在最近的浏览器中正常运行。

如何在延迟一段时间后在window.onload中加载javascript函数

4 个答案: