js window.onload 加载多个函数和追加函数
平时做项目 经常需要使用window.onload,
用法如下:
function func(){alert("this is window onload event!");return;}
window.onload=func;
或者如下:
window.onload=function(){alert("this is window onload event!");return;}
但window.onload 不能同时加载多个函数。
比如:
alert("t")
}
function b(){
alert("b")
}
window.onload =t ;
window.onload =b ;
后面会把前面的覆盖,上面代码只会输出 b。
此时可用如下方法解决:
window.onload =function() { t(); b(); }
另一种解决方法如下:
代码
function addLoadEvent(func) {
var oldonload = window.onload;//得到上一个onload事件的函数
if (typeof window.onload != 'function') {//判断类型是否为'function',注意typeof返回的是字符串
window.onload = func;
} else {
window.onload = function() {
oldonload();//调用之前覆盖的onload事件的函数---->由于我对js了解不多,这里我暂时理解为通过覆盖onload事件的函数来实现加载多个函数
func();//调用当前事件函数
}
}
}
//(完整示例)使用如下:
function t(){
alert("t")
}
function b(){
alert("b")
}
function c(){
alert("c")
}
function addLoadEvent(func) {
var oldonload = window.onload;
if (typeof window.onload != 'function') {
window.onload = func;
} else {
window.onload = function() {
oldonload();
func();
}
}
}
addLoadEvent(t);
addLoadEvent(b);
addLoadEvent(c);
//等价于 window.onload =function() { t(); b(); c() ;}
个人以为直接使用隐式函数(如:window.onload =function() { t(); b(); c() ;})更快捷,当然使用 addLoadEvent 更professional,各取所好吧!
JS window.onload追加函数:
<script>
if(window.attachEvent)//IE:如果浏览器中存在window.attachEvent函数则使用window.attachEvent函数,判断是否是IE还可以使用:if (document.all){//..}
window.attachEvent("onload",function() {alert("add method");});
else //FireFox
window.addEventListener("load",function() {alert("add method");},true);
</script>
运行,js中alert弹出消息,问题解决。
============相关资料================
attachEvent 将指定函数绑定到事件,以便每当该事件在对象上触发时都调用该函数。
Internet Explorer 从 5.0 开始提供了一个 attachEvent 方法,使用这个方法,就可以给一个事件指派多个处理过程了。attachEvent 对于目前的 Opera 也适用。但是 Mozilla/Firefox 并不支持这个方法。但是它支持另一个 addEventListener 方法,这个方法跟 attachEvent 差不多,也是用来给一个事件指派多个处理过程的。但是它们指派的事件有些区别,在 attachEvent 方法中,事件是以 “on” 开头的,而在 addEventListener
中,事件没有开头的 “on”,另外 addEventListener 还有第三个参数,一般这个参数指定为 false 就可以了。
最后感谢vForm表单验证程序的作者-雷晓宝
本文来自CSDN博客,转载请标明出处:http://blog.csdn.net/chenlei65368/archive/2009/09/12/4544823.aspx
js window.onload 加载多个函数和追加函数的更多相关文章
- javascript window.onload 加载多个函数的方法
用法如下: function func(){alert("this is window onload event!");return;} window.onload=func; 或 ...
- JS点击任意标签获得该标签属性,以获得ID为例,以及AJAX的异步原理和 $(document).ready()与window.onload加载方法的区别
js代码: //$(document).click(function (e) { // 在页面任意位置点击而触发此事件 // var select = ""; // var i = ...
- JS:window.onload的使用介绍
作者: 字体:[增加 减小] 类型:转载 时间:2013-11-13我要评论 window.onload在某些情况下还是比较实用的,比如加载时执行哪些脚本等等,下面有几个不错的示例,需要的朋友可以参考 ...
- 动态加载JS文件,并根据JS文件的加载状态来执行自己的回调函数
动态加载JS文件,并根据JS文件的加载状态来执行自己的回调函数, 在很多场景下,我们需要在动态加载JS文件的时候,根据加载的状态来进行后续的操作,需要在JS加载成功后,执行另一方法,这个方法是依托在加 ...
- JS,Javascript加载与函数执行过程
Js,Javascript加载与函数执行过程 test.html <!DOCTYPE HTML> <html lang="en"> <head> ...
- js图片预加载
图片预加载有大体有几种方式 1.html标签或css加载图片. 显而易见我们使用img标签或者通过标签的background-image属性都可以实现图片的预加载.但是为了避免初次载入过多图片影响体验 ...
- js jquery 页面加载初始化方法
js jquery 页面加载初始化方法 一.js页面加载初始化方法 // 1.在body里面写初始化方法. <body onload='init()'> </body> < ...
- js的动态加载、缓存、更新以及复用(四)
本来想一气呵成,把加载的过程都写了,但是卡着呢,所以只好在分成两份了. 1.页面里使用<script>来加载 boot.js . 2.然后在boot.js里面动态加载 bootLoad.j ...
- js的异步加载你真的懂吗
面试高频之js的异步加载 讲这个问题之前, 我们从另一个面试高频问题来切入, 我们的web页面从开始解析到页面渲染完成都经历了什么 ? 1 , 创建document对象, 开始解析页面, ...
随机推荐
- WebServerInitializedEvent &ApplicationRunner
application.properties app.name=yaoyuan2 app.dept.id=1 MyConfig.java import lombok.AllArgsConstructo ...
- redhat8 不支持ansible批量管理解决方案
redhat8默认不安装python,因此无法通过python去管理,直接上解决方案. dnf install python3 -y alternatives --set python /usr/bi ...
- c 循环左移
char b[11] = {'1', '2', '3', '4', '5', '6', '7', '8', '9', '0'}; const int iShift = 4; for (int j = ...
- 【php】Swoole之php高性能通信框架
Swoole介绍 swoole是由c语言开发的异步网络通信引擎,被编译为so文件(swoole.so)作为php的extesion扩展. 与其他普通扩展不同: 与普通的扩展不同的是普通的扩展只是提供一 ...
- 读书笔记 - js高级程序设计 - 第五章 引用类型
引用类型 和 类 不是一个概念 用typeof来检测属性是否存在 typeof args.name == "string" 需要实验 访问属性的方法 .号和[] 一般情况下要 ...
- Java算法练习——两数之和
题目链接 题目描述 给定一个整数数组 nums 和一个目标值 target,请你在该数组中找出和为目标值的那 两个 整数,并返回他们的数组下标. 你可以假设每种输入只会对应一个答案.但是,你不能重复利 ...
- clion 的 安装 变量配置的 搬运工(有点基础应该能看 大家看不懂 就是我自己看 哈哈哈哈哈哈)
1 自行安装一个 clion 2 https://blog.csdn.net/u013023297/article/details/80723847 mingw 的配置 第二篇好像当时 ...
- BZOJ [HAOI2006]旅行comf
题解:枚举最大边,然后对<=最大边的边做最大生成树,使最小边最大 #include<iostream> #include<cstdio> #include<cstr ...
- 京东云入选2019年度TOP100全球软件案例 新一代服务治理框架加速行业落地
11月14日-17日, 2019TOP100全球软件案例研究峰会(TOP100summit)在北京国家会议中心举办.Top100summit是科技界一年一度的案例研究峰会,每年会秉承"从用户 ...
- h5-其他伪元素
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...