9

最近我想出了以下问题:

在我的所有 html 页面的网站中,我在正文 onLoad 事件中调用了一个函数:

<body onLoad="func1();">

这是我的 html 模板的一部分,所以它出现在我网站的每个页面上,我无法更改它。现在,交易是在某些页面上,我需要调用其他一些函数 onload 并且我尝试使用 window.onload 属性,但它会擦除 func1 的调用......

我现在只能说:

window.onload = func2(); //where func2() calls to func1()

但这似乎又脏又蹩脚?不是吗?

那么,有没有一种方法可以在那些即将在onload 上执行的函数中添加一些函数,而不删除旧函数呢?此外,如果可以帮助我使用 asp.net...

谢谢!

4

5 回答 5

19

您可以使用 jQuery 链接负载处理程序。反复使用jQuery.loadjQuery(document).ready将链接您的处理程序(我相信)。您的另一个选择是以编程方式进行,这意味着您需要一个辅助函数来为您链接您的 onload 处理程序。您可以使用闭包(或匿名函数)执行此操作:

var addOnLoadHandler = function(newHandler) {

    if (typeof window.onload != 'function') {
        window.onload = newHandler;
    }

    else {
        var oldHandler = window.onload;
        window.onload = function() {
            if (oldHandler) {
                oldHandler();
            }
            newHandler();
        };
    }
};

但是,您必须以编程方式绑定您的函数,因此您必须这样做:

addOnLoadHandlers(function() {
 alert("Hi I am the first onLoad handler!");
});

addOnLoadHandlers(function() {
 alert("Hi I am the second onLoad handler!");
});

在 javascript 文件中(或在您的 html 文件中)。

另一种方法是使用数组:

var onloaders = new Array();

function runOnLoads() {
    for (i = 0; i < onloaders.length; i++) {
        try {
            var handler = onloaders[i];
            handler();
        } catch(error) {
            alert(error.message);
        }
    }
}

function addLoader(obj) {
    onloaders[onloaders.length] = obj;
}

在您的 HTML 或 Javascript 文件中,您可以:

addLoader(function() {
 alert("Hi I am the first onLoad handler!");
});

addLoader(function() {
 alert("Hi I am the second onLoad handler!");
});

然后在你的html中你可以做<body onload="runOnLoads()">

于 2010-02-16T22:48:23.283 回答
5

您可能希望充分利用匿名函数:

function addLoadEvent(func) {
    var oldonload = window.onload;
    if (typeof window.onload != 'function') {
        window.onload = func;
    }
    else {
        window.onload = function() {
            oldonload();
            func();
        }
    }
}

借鉴了有史以来排名前 10 位的自定义 JavaScript 函数

于 2010-02-16T22:47:27.283 回答
5

jQuery 有一个很好的简写方式,可以将多个已定义的处理程序添加到“就绪”事件(不适用于必须使用 $(document).ready(function(){}); 的匿名函数)。

简单地

$(myFunction);
$(myFunction2);

一个很大的优点是,如果 DOM 已经加载,它仍然会被触发,而在事件之后绑定到 window.onload 的任何东西都不会被调用。

于 2010-02-17T06:26:48.560 回答
3

你有没有考虑过像 jquery 这样的 javascript 库,我知道还有其他方法,但 jquery 会让你的生活变得更轻松......

$(function(){
   //Do stuff when DOM is loaded.
   func1();
    $('#link').click(function(){
        //bind a click event
    });
});

经典的方法是将所有功能粘贴在页面底部:)

于 2010-02-16T22:46:38.680 回答
3

在jquery中你可以做

$(document).onload(function() {
  // do something
}

//然后稍后做

$(document).onload(function() {
  // do something here too!
}

jQuery 会智能地将这两个事件添加到 onload 事件中,并在页面加载时执行。使用 jQuery,您还可以获得跨浏览器支持作为额外奖励。

于 2010-02-16T23:25:18.687 回答