共享onload事件

wzr

我们在JavaScript中经常需要在网页文档加载完毕后立刻执行某函数。网页加载完毕后会触发一个onload事件，这个时间与window对象相关联。

例如，我们现在有一个wasabi函数，我们需要在网页文档加载完毕后立刻执行wasabi函数，那么我们就这样写：

window.onload = wasabi;

但是假如我有两个函数怎么办呢？比如我现在有一个wasabi1函数和一个wasabi2函数，怎样让它们都在页面加载时得到执行？我们可能会想到将它们逐一绑定在onload事件上：

window.onload = wasabi1;
window.onload = wasabi2;

但其实，这样的做法是错误的！ 它们中只有最后一个函数（即wasabi2）才会被得到实际执行。因为wasabi2将取代wasabi1

在需要绑定的函数不是很多的场合，我们可以这样写：

window.onload = function()
{
    wasabi1();
    wasabi2();
}

但是在需要绑定的函数非常多的时候，这时就不适用了。Simon Willison大神早就给出了一个解决方案：编写一个addLoadEvent函数：

function addLoadEvent(func)
{
    var oldonload = window.onload;//将现有的window.onload事件存入oldonload变量
    if(typeof window.onload != 'function')//如果这个事件处理函数上还没有绑定任何函数
        window.onload = func;//那么就给它添加这个函数
    else//如果事件处理函数上已经有了其他的函数
    {
        window.onload = function()
        {
            oldonload();//执行旧的函数
            func();//并将新函数追加到现有指令的末尾
        }
    }
}

这样我们以后在需要网页加载完毕后执行多个函数时，就只用这样写：

addLoadEvent(wasabi1);
addLoadEvent(wasabi2);