脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 网络编程 → 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绑定多个事件的方法，希望对大家有所帮助！

您可能感兴趣的文章:

相关文章

  • 如何用JavaScript实现动态修改CSS样式表

    如何用JavaScript实现动态修改CSS样式表

    如何用JavaScript实现动态修改CSS样式表？下面小编就为大家带来一篇JavaScript实现动态修改CSS样式表的方法。希望对大家有所帮助。一起跟随小编过来看看吧
    2016-05-05
  • javascript制作坦克大战全纪录（2）

    javascript制作坦克大战全纪录（2）

    上文我们简单的完成了坦克大战的雏形，本文我们来继续完善坦克大战，接下来我们来学习制作地图和碰撞检测方面的问题。
    2014-11-11
  • 教你如何使用THREEJS实现一个可调节档位、可摇头的电风扇

    教你如何使用THREEJS实现一个可调节档位、可摇头的电风扇

    夏天到了，用Three.js实现一个可以摇头和调节档位的电风扇，主要使用到Blender处理3D模型，用Vite+Typescript搭建项目框架，这篇文章主要介绍了使用THREEJS实现一个可调节档位、可摇头的电风扇,需要的朋友可以参考下
    2023-06-06
  • JavaScript游戏之优化篇

    JavaScript游戏之优化篇

    最近回头看看自己以前写的游戏代码，总结出几个可以优化改进的地方，当然还有很多地方需要优化，还希望大家指出来。
    2010-11-11
  • js自制图片放大镜功能

    js自制图片放大镜功能

    这篇文章主要为大家详细介绍了js自制图片放大镜功能的相关资料，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
    2017-01-01
  • 多浏览器兼容的动态加载 JavaScript 与 CSS

    多浏览器兼容的动态加载 JavaScript 与 CSS

    Omar AL Zabir这位MVP总是喜欢搞些稀奇古怪同时又很实用的小东西，并且还十分值得参考。最近他就做了一个叫做ensure的小工具用于动态加载JavaScript、CSS与HTML，而且IE、Firefox、Opera、Safari都支持了，那么我们就来看看ensure是如何做到动态加载JavaScript与CSS的。
    2008-09-09
  • addEventListener 的用法示例介绍

    addEventListener 的用法示例介绍

    这篇文章主要介绍了addEventListener 的用法,需要的朋友可以参考下
    2014-05-05
  • JavaScript的类型、值和变量小结

    JavaScript的类型、值和变量小结

    这篇文章主要介绍了JavaScript的类型、值和变量小结的相关资料,需要的朋友可以参考下
    2015-07-07
  • webpack自动引入打包资源HtmlWebpackPlugin的实现

    webpack自动引入打包资源HtmlWebpackPlugin的实现

    本文主要介绍了webpack自动引入打包资源HtmlWebpackPlugin的实现，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
    2023-07-07
  • 网上抓的一个特效

    网上抓的一个特效

    网上抓的一个特效...
    2007-05-05

最新评论