`
royzhou1985
  • 浏览: 250577 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

JavaScript执行window.onload和body onload多个处理过程的方法

阅读更多
JavaScript执行window.onload和body onload多个处理过程的方法
以前写 JavaScript 脚本时,事件都是采用
object.event = handler;
的方式初始化。这种方式对于 Internet Explorer、Mozilla/Firefox 和 Opera 来说很通用。但是有一个问题就是,这种方式只能一个事件对应一个事件处理过程。如果希望一个事件可以依次执行多个处理过程就不好用了。

但是 Internet Explorer 从 5.0 开始提供了一个 attachEvent 方法,使用这个方法,就可以给一个事件指派多个处理过程了。attachEvent 对于目前的 Opera 也适用。但是问题是 Mozilla/Firefox 并不支持这个方法。但是它支持另一个 addEventListener 方法,这个方法跟 attachEvent 差不多,也是用来给一个事件指派多个处理过程的。但是它们指派的事件有些区别,在 attachEvent 方法中,事件是以 “on” 开头的,而在 addEventListener 中,事件没有开头的 “on”,另外 addEventListener 还有第三个参数,一般这个参数指定为 false 就可以了。




因此要想在你的程序中给一个事件指派多个处理过程的话,只要首先判断一下浏览器,然后根据不同的浏览器,选择使用 attachEvent 还是 addEventListener 就可以了。实例如下:

Java代码
if (document.all) {  
window.attachEvent('onload', handler1);  
window.attachEvent('onload', handler2);  
}  
else {  
window.addEventListener('load', handler1, false);  
window.addEventListener('load', handler2, false);  


if (document.all) {
window.attachEvent('onload', handler1);
window.attachEvent('onload', handler2);
}
else {
window.addEventListener('load', handler1, false);
window.addEventListener('load', handler2, false);
}


注意:attachEvent 所指派的多个过程的执行顺序是随机的,所以这几个过程之间不要有顺序依赖。另外 attachEvent 和 addEventListener 不仅仅适用于 window 对象,其他的一些对象也支持该方法。

另外为了方便我也写了个function sunet_addEvent(obj, evType, fn),如下:


Java代码
function sunet_addEvent(obj, evType, fn)  
{  
if (obj.addEventListener){  
obj.addEventListener(evType, fn, false);  
return true;  
}else if (obj.attachEvent){  
var r = obj.attachEvent("on"+evType, fn);  
return r;  
}else{  
return false;  
}  


function sunet_addEvent(obj, evType, fn)
{
if (obj.addEventListener){
obj.addEventListener(evType, fn, false);
return true;
}else if (obj.attachEvent){
var r = obj.attachEvent("on"+evType, fn);
return r;
}else{
return false;
}
}
// 调用例子:Java代码
sunet_addEvent(window,"locad",init); 
分享到:
评论

相关推荐

    获取页面长宽和滚动条的位置

    <!...<html xmlns="http://www.w3.org/1999/xhtml" > <script type="text/javascript"> function GetPageSize() { var scrW, scrH; if(window.innerHeight && window....<body onload="main();"> </body> </html>

    javascript函数的解释

    这个例子实现过程为:,开始计时-----判断(小于5秒则返回继续计时)----提交按钮恢复为可用。…………分解完了,再为每步写好实现代码; 第一步:倒计时 我们先设定一个初始时间值6秒:var t=6; 然后每过一秒t-1; ...

    Web前端开发工程师笔试题及答案

    腾迅Web前端开发工程师笔试题及答案 ...function elementName(evt){ evt = evt|| window.... window.onload = function(){ var el = document.getElementsByTagName('body'); el[0].onclick = elementName; } ......

    107个常用javascript语句

    107个常用javascript语句 -7.焦点 .focus(); -6.捕获对象通用方法 function $(obj) {return document.getElementById(obj);} ("") %> -5.字符串赋值数组var array=new Array(); array=tdrczpdata.split('<BR>'); ...

    获取本机IP地址的实例(JavaScript / Node.js)

    –web 客户端JavaScript <!-- 调用方式 --> <body onload="checkCookie()"></body> function getYourIP() { const RTCPeerConnection = window.RTCPeerConnection || window....

    javascript提示类

    某页面中button按钮事件写代码如下: ... Response.Write("<script>window.open('" + Str1 + "','_blank');window.showModalDialog('close....<body onload="window.parent.opener=null;window.close();"> </body> </html>

    javascript小技巧

    window.onload=setmessage2 else if (document.all) window.onload=setmessage <center> <tr><td align=center>, Helvetica, sans-serif">下面为脚本显示区!</strong></font></td></tr><tr><td ...

    右下角弹出窗口 javascript

    window.onload=function(){showBox();setTimeout("closeBox()",10000)} function showBox(o){ if (o==undefined) o=document.getElementById("rbbox"); o.style.height=o.clientHeight+2+"px"; if (o.clie

    JavaScript面试题集锦.doc

    window.onload = function() { submitbtn(); } <body> </body> ``` 这个例子中,我们使用了两个输入框和两个提交按钮。每个提交按钮的点击事件都可以交换两个输入框的值。 本资源收录了多种 ...

    详解JavaScript中getFullYear()方法的使用

    javascript Date.getFullYear()方法按照本地时间返回指定日期的年份。通过getFullYear返回的值是一个绝对的数字。对于1000年和9999之间的日期,getFullYear返回一个4位数字,例如2008年。 语法 Date.getFullYear() ...

    Asp.net中防止用户多次登录的方法

    然后在 logout.aspx 的 Page_Load 中写和 session_End 相同的方法,同时在logout.aspx 中加入事件:onload="Javascript:window.close()" 但是这样还是有问题,Javascript 在不同的浏览器中可能有不同的行为,还有...

    用meta实现的页面跳转代码

    用meta实现的页面跳转代码,建议与js一起使用,防止页面假死或不支持js的情况,都可以实现效果。

    JS关闭窗口弹出新窗口,关闭新窗口时,刷新父窗口,JS代码实现刷新网页,js实现弹出窗口代码收集集萃

    JS 实现弹出窗口和刷新父窗口 在网页开发中,弹出窗口是非常常见的一种交互方式,通常用于展示注意事项、版权信息、警告、欢迎光顾等信息。今天,我们将探索如何使用 JavaScript 实现弹出窗口,并且在关闭新窗口时...

    【JavaScript源代码】JavaScript 鼠标事件(MouseEvent)案例讲解.docx

    JavaScript 鼠标事件(MouseEvent)案例讲解  鼠标事件-MouseEvent 当鼠标进行某种... console.log(e) } window.onload = function (){ document.getElementsByTagName('body')[0].addEventListener('mousedown',mo

    js使用小技巧

    <body onload="window.resizeTo(window.screen.width - 4,window.screen.height-50);window.moveTo(-4,-4)"> 无关闭按钮IE window.open("aa.htm", "meizz", "fullscreen=7"); 统一编码/解码 alert...

    JavaScript阻止浏览器返回按钮的方法

    本文实例讲述了JavaScript阻止浏览器返回按钮的方法。分享给大家供大家参考。具体分析如下: 下面的JS代码可以阻止用户点击返回按钮,非常实用,需要的朋友可以收藏一下。 [removed] window.history.forward(); ...

    jqzoom放大镜插件.zip

    * JQZoom Evolution 1.0.1 - Javascript Image magnifier * * Copyright (c) Engineer Renzi Marco(www.mind-projects.it) * * $Date: 12-12-2008 * * ChangeLog: * * $License : GPL,so any change to ...

    PDFObject在线载入PDF

    window.onload = function (){ var success = new PDFObject({ url: "~/pdf/dtix201406-l.pdf" ,pdfOpenParams: { scrollbars: '0', toolbar: '0', statusbar: '0'}}).embed("pdf1"); }; </script> <body> ; ...

    javaScript常用事件

    常用javaScript事件归纳。 常用事件: 1.onclick 鼠标单击事件 通常在下列基本对象中产生: button(按钮对象) checkbox(复选框)或(检查列表框) radio (单选钮) reset buttons(重要按钮) submit ...

Global site tag (gtag.js) - Google Analytics