添加多个 window.onload 事件

Add multiple window.onload events

提问人:Ray 提问时间:8/13/2008 最后编辑:Rich ChurcherRay 更新时间:11/16/2018 访问量:66263

问:

在我的 ASP.NET 用户控件中,我将向事件添加一些 JavaScript:window.onload

if (!Page.ClientScript.IsStartupScriptRegistered(this.GetType(), onloadScriptName))
  Page.ClientScript.RegisterStartupScript(this.GetType(), onloadScriptName, 
    "window.onload = function() {myFunction();};", true);            

我的问题是,如果事件中已经有一些东西,那么它会覆盖它。我将如何允许两个用户控件在事件中分别执行 JavaScript?onloadonload

编辑:感谢您提供有关第三方库的信息。我会牢记它们。

JavaScript asp.net 事件 侦听器

评论

1赞 Frank Schwieterman 1/14/2009
Wee Don't need no Stinkin 图书馆!仅供参考,对于 firefox,它的 window.attachEvent('load', myFunction);不是 window.attachEvent('ONload', myFunction);
0赞 Jeff Atwood 8/13/2008
您是否考虑过使用像 JQuery 这样的东西,它提供了一个用于清理添加多个事件处理程序的框架?

答:

1赞 Derek Park 8/13/2008 #1

我对 ASP.NET 了解不多,但为什么不为 onload 事件编写一个自定义函数,该函数反过来为您调用这两个函数呢?如果有两个函数,请从为事件注册的第三个脚本中调用它们。

2赞 Chris Farmer 8/13/2008 #2

试试这个:

window.attachEvent("onload", myOtherFunctionToCall);

function myOtherFunctionToCall() {
    // do something
}

编辑:嘿,我刚刚准备使用Firefox登录并自己重新格式化!似乎仍然没有用 IE7 为我格式化代码。

1赞 Derek Park 8/13/2008 #3

实际上,根据此MSDN页面,看起来您可以多次调用此函数来注册多个脚本。您只需要使用不同的键(第二个参数)。

Page.ClientScript.RegisterStartupScript(
    this.GetType(), key1, function1, true);

Page.ClientScript.RegisterStartupScript(
    this.GetType(), key2, function2, true);

我相信这应该有效。

评论

0赞 Ray 12/18/2008
当页面到达这些脚本时,这些脚本不会被执行吗?在加载期间不行?
3赞 cole 8/13/2008 #4

Mootools 是另一个很棒的 JavaScript 框架,它相当易于使用,就像 RedWolves 所说的那样,使用 jQuery,您可以根据需要继续夹杂任意数量的处理程序。

对于我包含的每个 *.js 文件,我只是将代码包装在一个函数中。

window.addEvent('domready', function(){
    alert('Just put all your code here');
});

使用 domready 而不是 onload 也有优点

19赞 Vincent Robert 8/13/2008 #5

仍然有一个丑陋的解决方案(远不如使用框架或 /)来保存当前事件:addEventListenerattachEventonload

function addOnLoad(fn)
{ 
   var old = window.onload;
   window.onload = function()
   {
       old();
       fn();
   };
}

addOnLoad(function()
{
   // your code here
});
addOnLoad(function()
{
   // your code here
});
addOnLoad(function()
{
   // your code here
});

请注意,像jQuery这样的框架将提供一种在DOM准备就绪时执行代码的方法,而不是在页面加载时执行代码。

DOM 就绪意味着您的 HTML 已经加载,但外部组件(如图像或样式表)尚未加载,因此可以在 load 事件触发之前很久就调用您。

106赞 user83421 3/27/2009 #6

建议的大多数“解决方案”都是特定于 Microsoft 的,或者需要臃肿的库。这是一个好方法。这适用于兼容 W3C 的浏览器和 Microsoft IE。

if (window.addEventListener) // W3C standard
{
  window.addEventListener('load', myFunction, false); // NB **not** 'onload'
} 
else if (window.attachEvent) // Microsoft
{
  window.attachEvent('onload', myFunction);
}

评论

1赞 user961954 10/18/2011
注意:window.attachEvent('onload', myFunction) 中分配的函数 (myFunction);始终在分配给 window.onload 的任何函数后触发
1赞 meJustAndrew 11/22/2016
对不起,先生,NB not 'onload'是什么意思?
1赞 fmacdee 5/6/2017
@meJustAndrew他的意思是,当你使用 addEventListener 时,你不使用 'onload',你只使用 'load'。
7赞 Fábio de Lima Souto 12/1/2010 #7

我今天遇到了类似的问题,所以我通过以下方法解决了它:index.js

window.onloadFuncs = [];

window.onload = function()
{
 for(var i in this.onloadFuncs)
 {
  this.onloadFuncs[i]();
 }
}

在我想附加 onload 事件的其他 js 文件中,我只需要这样做:

window.onloadFuncs.push(function(){
 // code here
});

虽然我通常使用 jQuery,但这次我仅限于纯 js,被迫使用我的头脑一段时间!

评论

0赞 AntumDeluge 4/12/2023
这似乎是最简单的解决方案。只需要记住首先在 HTML 标头中包含索引/加载器脚本。
1赞 DadViegas 8/30/2012 #8

你可以用jquery来做到这一点

$(window).load(function () {
    // jQuery functions to initialize after the page has loaded.
});