当前位置: 首页 > 编程笔记 >

window.onload绑定多个事件的两种解决方案

慕容成和
2023-03-14
本文向大家介绍window.onload绑定多个事件的两种解决方案,包括了window.onload绑定多个事件的两种解决方案的使用技巧和注意事项,需要的朋友参考一下

前言

有些函数,必须在网页加载完毕后执行。比如:涉及DOM操作的。

网页加载完毕时会触发一个onload事件,将函数绑定到这个事件上即可。


window.onload = myFunction;

问题来了:如果需要同时绑定多个事件,该如何处理呢?有两种解决方法

方案一

创建一个匿名函数,来容纳需要绑定的多个事件,再讲这个匿名函数绑定到onload事件上

window.onload = function(){
firstFunction();
secondFunction();
...... 
}

方案二

由Simon Willsion编写的addLoadEvent函数:

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

将现有的window.onload事件处理函数的值存入变量oldOnload
如果这个处理函数上还没有绑定函数,则和那样把新函数绑定给它。
如果已经绑定了函数,则把新的函数追加到指令的末尾。

调用方法:

addEventLoad(firstFuction);

addEventLoad(secondFuction);

以上内容是小编通过两种方案给大家介绍的window.onload绑定多个事件的方法,希望对大家有所帮助!

 类似资料:
  • 本文向大家介绍多种jQuery绑定事件的实现方式,包括了多种jQuery绑定事件的实现方式的使用技巧和注意事项,需要的朋友参考一下 最近发现jQuery一个对象的事件可以重复绑定多次,当事件触发的时候会引起代码多遍执行。 下面是一个click事件被重复绑定的示例: 下面给出解决方法: 对于需要重复绑定的场景,再事件注册时候考虑用先unbind 再bind的方法;或者先off 再on 那jQuery

  • 本文向大家介绍Jquery on方法绑定事件后执行多次的解决方法,包括了Jquery on方法绑定事件后执行多次的解决方法的使用技巧和注意事项,需要的朋友参考一下 这两天工作中遇到使用js动态加载内容,同时需要对加入的内容绑定点击事件的,当时想想了想可以使用内联的onclick 来实现,后来没有这样做,使用的是 on(‘click',function(){}) ,然而使用on方法的时候就发现,on

  • 本文向大家介绍jQuery绑定事件-多种实现方式总结,包括了jQuery绑定事件-多种实现方式总结的使用技巧和注意事项,需要的朋友参考一下 jQuery绑定事件-多种实现方式总结 以上这篇jQuery绑定事件-多种实现方式总结就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持呐喊教程。

  • 本文向大家介绍JQuery绑定事件四种实现方法解析,包括了JQuery绑定事件四种实现方法解析的使用技巧和注意事项,需要的朋友参考一下 jQuery提供了多种绑定事件的方式,每种方式各有其特点,明白了它们之间的异同点,有助于我们在写代码的时候进行正确的选择,从而写出优雅而容易维护的代码。下面我们来看下jQuery中绑定事件的方式都有哪些。 jQuery中提供了四种事件监听方式,分别是bind、li

  • 本文向大家介绍JQuery给元素绑定click事件多次执行的解决方法,包括了JQuery给元素绑定click事件多次执行的解决方法的使用技巧和注意事项,需要的朋友参考一下 原绑定方法: 这种方法只会在原click方法中继续添加新方法; 解决办法更改绑定方法为: 在绑定新click方法前对元素所绑定的click方法解绑

  • 本文向大家介绍js绑定事件和解绑事件,包括了js绑定事件和解绑事件的使用技巧和注意事项,需要的朋友参考一下 在js中绑定多个事件用到的是两个方法:attachEvent和addEventListener,但是这两个方法又存在差异性 attachEvent方法  只支持IE678,不兼容其他浏览器 addEventListener方法   兼容火狐谷歌,不兼容IE8及以下 addEventListe