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

Question

我有几个函数应该在onload事件延迟后触发。它在Chrome中运行正常，但不在Firefox中运行。

function foo() { 
    // javascript code 
} 

window.onload = setTimeout(foo, delay); 

function bar() { 
    // javascript code 
} 

window.onload = setTimeout(bar, delay); 

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

Answer 1

尝试包裹超时的功能：

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

Answer 2

我很惊讶，这两种功能得到在任何浏览器调用。但你可能有更好的运气，像这样的：

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 3

您可以用某事像使用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 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年开始更新，所以我会确保它正常工作在最新的浏览器。