脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 网络编程 → JavaScript → javascript技巧 → window.onload

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

 更新时间：2016年05月15日 16:33:37   作者：鬼脸  
这篇文章主要介绍了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绑定多个事件的方法，希望对大家有所帮助！

您可能感兴趣的文章:

相关文章

  • js+flash实现的5图变换效果广告代码(附演示与demo源码下载)

    js+flash实现的5图变换效果广告代码(附演示与demo源码下载)

    这篇文章主要介绍了js+flash实现的5图变换效果广告代码,涉及JavaScript结合flash调用图片实现幻灯广告效果,并附带演示与demo源码供读者下载参考,需要的朋友可以参考下
    2016-04-04
  • js trim函数 去空格函数与正则集锦

    js trim函数 去空格函数与正则集锦

    在javascript中处理文本框输入值的时候，经常要用到"去掉前后空白"的功能。用过jQuery的朋友都知道，jQuery提供了一个trim()这样的功能函数，可以很轻松帮我们实现这样的效果。
    2009-11-11
  • js 创建快捷方式的代码(fso)

    js 创建快捷方式的代码(fso)

    js 创建快捷方式的代码,这个是在本地运行的需要确认的，需要的朋友可以参考下。
    2010-11-11
  • JS+CSS实现美化的下拉列表框效果

    JS+CSS实现美化的下拉列表框效果

    这篇文章主要介绍了JS+CSS实现美化的下拉列表框效果,涉及javascript针对下拉列表框样式的相关操作技巧,非常美观大方,需要的朋友可以参考下
    2015-08-08
  • 一文搞懂JSON(JavaScript Object Notation)

    一文搞懂JSON(JavaScript Object Notation)

    Json 有两种基本的结构，即 Json对象 和 Json 数组。通过 Json 对象和 Json 数组这两种结构的组合可以表示各种复杂的结构，今天通过本文给大家介绍JavaScript Object Notation的基本知识，感兴趣的朋友一起看看吧
    2021-10-10
  • Array数组对象中的forEach、map、filter及reduce详析

    Array数组对象中的forEach、map、filter及reduce详析

    这篇文章主要给大家介绍了关于Array数组对象中forEach、map、filter及reduce的相关资料，文中通过示例代码介绍的非常详细，对大家学习或者使用array数据具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
    2018-08-08
  • 彻底解决 webpack 打包文件体积过大问题

    彻底解决 webpack 打包文件体积过大问题

    本篇文章主要介绍了彻底解决 webpack 打包文件体积过大问题，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
    2017-07-07
  • js实现简单五子棋游戏

    js实现简单五子棋游戏

    这篇文章主要为大家详细介绍了js实现简单五子棋游戏，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2020-05-05
  • JS实现获取本月的开始时间与结束时间

    JS实现获取本月的开始时间与结束时间

    在JavaScript中,可以使用Date对象来获取本月的开始时间和结束时间,本文通过代码示例详细的给大家介绍了JS获取本月的开始时间与结束时间,感兴趣的小伙伴跟着小编一起来看看吧
    2023-08-08
  • getComputedStyle与currentStyle获取样式(style/class)

    getComputedStyle与currentStyle获取样式(style/class)

    通过document.getElementById(element).style.xxx可以获取元素的样式信息但是对于通过class属性引用的外部样式表就获取不到了，感兴趣的朋友可以了解下
    2013-03-03

最新评论