把多个JavaScript函数绑定到onload事件处理函数上的方法
更新时间：2016年09月04日 10:27:41 投稿：jingxian
下面小编就为大家带来一篇把多个JavaScript函数绑定到onload事件处理函数上的方法。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
为了让函数只在页面加载完毕后才得到执行，我们会把函数绑定到onload事件上：
window.onload = userFunction
但如果有两个函数：firstFunction() 和 secondFunction()，都想让它们在页面加载完毕后得到执行，该怎么办？如果这样：
window.onload = firstFunciton; window.onload = secondFunction;
只有最后一个函数能被执行。由此可得：每个事件处理函数只能绑定一条指令。
但我们可以这样做：
window.onload = function(){
firstFunction();
secondFunction();
}
这是一个解决办法。
不过，还有一个更通的解决方案——额外编写一些代码，但好好处是，有了这些代码，把函数，不管它们有多少，绑定到window.onload事件上的工作就非常简明易行了。
这个函数的的名字是addLoadEvent，它是由Simon Willison编写的。它只有一个参数：打算在页面加载完毕时执行的函数的名字。
下面是addLoadEvent()函数将要完成的操作：
1. 把现有的window.onload事件处理函数的值存入变量oldonload。
2. 如果在这个处理函数上还没有绑定任何函数，就像平时那样把形函数添加给它。
3. 如果在这个处理函数上已经绑定了一些函数，就把形函数追加到现有指令的末尾。
下面是addLoadEvent()函数的代码清单：
function addLoadEvent(func){
var oldonload = window.onload;
if(typeof window.onload != 'function'){
window.onload = func;
}else{
window.onload = function(){
oldonload();
func();
}
}
}
这相当于为那些将在页面加载完毕时执行的函数创建了一个队列。如果想把刚才那两个函数添加到队列中去，只需要写出以下代码即可：
addLoadEvent(firstFunction); addLoadEvent(secondFunction);
以上这篇把多个JavaScript函数绑定到onload事件处理函数上的方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
在JavaScript中虽没有类似的方法，但我们可以利用字符串的replace方法自定义字符串的格式化方法。下面通过本文给大家分享使用JS在HTML中自定义字符串格式化的方法，需要的的朋友参考下吧2017-07-07
这篇文章主要介绍了js获取json元素数量的方法,可实现对json元素数量的统计功能,具有一定参考借鉴价值,需要的朋友可以参考下2015-01-01
这篇文章主要介绍了JS学习笔记之数组去重实现方法,结合实例形式总结分析了javascript数组去重的5种常见实现方法及相关操作技巧,需要的朋友可以参考下2019-05-05
要知道localStorage本身并没有提供过期机制,既然如此那就只能我们自己来实现了,这篇文章主要给大家介绍了关于如何实现localStorage过期机制的相关资料,需要的朋友可以参考下2022-02-02
这篇文章主要给大家介绍了关于three.js着色器材质内置变量的相关资料，文中通过示例代码介绍的非常详细，对大家学习或者使用three.js具有一定的参考学习价值，需要的朋友们下面来一起学习学习吧2020-08-08
这篇文章主要为大家详细介绍了js实现滑动门效果的相关代码，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-03-03
JSON是一种轻量级（Light-Meight)、基于文本的(Text-Based)、可读的(Human-Readable)格式，这篇文章主要介绍了JSON 基本使用教程,需要的朋友可以参考下2023-02-02
如一个文件上传功能，需要对上传文件进行文件格式限制。我们通常会使用后缀名做限制。2011-03-03
本文主要介绍了使用javascript实现雪花飘落的特效，虽然网上有很多，不过都是比较陈旧了，兼容性不是太好，于是动手写一个，把思路和实现代码都分享给大家。2015-01-01
javascript另类方法实现htmlencode()与htmldecode()函数实例分析
这篇文章主要介绍了javascript另类方法实现htmlencode()与htmldecode()函数,结合实例形式分析了javascript字符编码与解码操作的相关技巧,需要的朋友可以参考下2016-11-11
最新评论