在给网页加一些特效时经常要在<body>中加入“onload”事件,即在网页加载完后执行某事件,例如:<body onload=”alert(‘欢迎光临!')”,但这样做有个大的缺陷,事件会在网页完全下载完后才会执行,包括网页中的图片或Flash等,如果网页中的图片比较大或有很多图,可能还没等网页完全下载完网友已经点击链接到其它网页去了,这样这个事件就没有执行了。另外在某些特殊情况下可能还修改不了网页的body参数。如在别人网站发表文章时,或用CMS整站系统时。

  这时我们会想到用“window.onload”或“document.body.onload”来替换<body>中的onload事件,的确,问题解决了,但在加载多个onload事件时或控制加裁顺序时还会出现一些问题,直到我发现“Paul Koch”写的addLoadEvent()函数后,所有问题都解决了。如果大家一定要用“window.onload”或 “document.body.onload”来替换<body>中的onload事件,建议大家用前者,Firefox浏览器中无效,即兼容性有问题。

function addLoadEvent( func ){
var oldonload = window.onload;
if(typeof window.onload != "function"){
window.onload = func;
}else{
window.onload = function () {
oldonload();
func();
};
};
};

addLoadEvent函数主要是完成如下的操作: 

1、把现有的window.onload事件处理函数的值存入到oldonload中。

2、如果在这个处理函数上还没有绑定任何函数,就将该函数添加给它。

3、如果在这个处理函数上已经绑定了一些函数,就把该函数追加到现有指定的末尾。

调用方法:通过addLoadEvent函数,只需要调用该函数就可以进行绑定了。

addLoadEvent(firestFunction);
addLoadEvent(secondFunction);
//或
addLoadEvent(function(){
document.body.style.backgroundColor = 'yellow';
firstFunction();
});

onload事件-----addLoadEvent函数的更多相关文章

  1. JavaScript学习笔记(散)——addLoadEvent函数

    先贴源码 function addLoadEvent(func) { var oldonload = window.onload; //存入当前onload事件 if(typeof window.on ...

  2. JavaScript window.onload 事件和 jQuery ready 函数有何不同?

    JavaScript window.onload 事件和 jQuery ready 函数之间的主要区别是,前者除了要等待 DOM 被创建还要等到包括大型图片.音频.视频在内的所有外部资源都完全加载.如 ...

  3. jquery load()函数和window.onload事件

    我想用jquery load()一个饼状图页面, 但是load不出来 代码如下: 后来百度了一下,解决办法如下: window.onload事件只有在文档载入的时候才会执行的,你载入子页面不会触发这个 ...

  4. JavaScript 中 onload 事件绑定多个方法

    当需要调用的方法较多时,我们可以进一步优化,编写一个专门用于绑定 onload事件的方法: function addLoadEvent(func) { //把现有的 window.onload 事件处 ...

  5. 共享onload事件

    在做前端工作中,我们想要设置某个函数prepare,让它在网页加载完毕后执行,会触发一个onload事件,这个事件与windows对象相关联,必须把prepare函数绑定到这个时间上,语法如下:win ...

  6. javascript学习—理解addLoadEvent函数

    onload事件是HTML DOM Event 对象的一个属性,又叫事件句柄(Event Handlers),它会在页面或图像加载完成后(注意是加载完成后)立即发生. window.onload = ...

  7. js共享onload事件

    问题:通过js进行事件绑定,必须在HTML文档加载完成后再执行js脚本,否则可能因DOM不完整导致无法完成预计的效果,但对于不同的需求如何选用最佳的实现方式呢,这里做了整理,可以做参考. 一.对于小型 ...

  8. 把多个js函数绑定到onload时间处理函数上

    js的window.onload=function();网页加载完毕时会触发一个onload事件,这个事件与window对象相关联,是让一个函数在网页加载完毕之后得到执行.但是如果有两个韩式first ...

  9. JavaScript 中 onload 事件绑定多个方法的优化建议

    页面加载完毕时会触发 onload 事件.基于内容(HTML)要与行为(JavaScript)分离的编码思想,我们需要将一些对页面的初始化操作写在方法内,并通过window.onload = func ...

随机推荐

  1. HYSBZ 2002 分块

    题目链接:http://www.lydsy.com/JudgeOnline/problem.php?id=2002 题意:中文题面 思路:考虑分块,每个位置维护一个跳出该块需要的步数cnt[],和跳出 ...

  2. Only Link: Inheritance — private and protected inheritance in c++

    reading note link: https://isocpp.org/wiki/faq/private-inheritance

  3. 【BZOJ1076】[SCOI2008]奖励关 状压DP+期望

    [BZOJ1076][SCOI2008]奖励关 Description 你正在玩你最喜欢的电子游戏,并且刚刚进入一个奖励关.在这个奖励关里,系统将依次随机抛出k次宝物,每次你都可以选择吃或者不吃(必须 ...

  4. redis、memcached、mongoDB 对比与安装

    一.redis.memcached.mongoDB 对比 Memcached 和 Redis都是内存型数据库,数据保存在内存中,通过tcp直接存取,速度快,并发高.Mongodb是文档型的非关系型数据 ...

  5. PHP中面向对象的关键字

    php面向对象中常用的关键字有final.static.const (1)final: 1,final不能修饰成员属性 2,final只能修饰类和方法 作用: 使用final修饰的类不能被子类继承 使 ...

  6. wordpress 安装 "Table Prefix" must not be empty.

    时隔一年了,一年没有写代码了.又重拾代码,心情无法言表啊.互联网还是有机会的. 安装wordpress怎么装 setp2了就 报 "Table Prefix" must not b ...

  7. 使用XML文件记录操作日志,并从后往前读取操作日志并在richTextBox1控件中显示出来

    #region 获取本地程序操作记录日志 /// <summary> /// 获取本地程序更新日志信息(由后往前读取) /// </summary> private void ...

  8. 从零开始编写自己的C#框架(3)——开发规范(转)

    由于是业余时间编写,而且为了保证质量,对写出来的东西也会反复斟酌,所以每周只能更新两章左右,请大家谅解,也请大家耐心等待,谢谢大家的支持. 初学者应该怎样学习本系列内容呢?根据我自己的学习经验,一般直 ...

  9. C指针-const char* p到底是什么不可以改变

    char a = 'w'; char b = 'q'; const char* p = &a; p = &b; printf("%c",p[0]); 如上一段代码, ...

  10. presto-elasticsearch connector

    elasticsearch搜索功能强劲,就是查询语法复杂,presto提供了非常open的plugin机制,我改进了下原有的presto-elasticsearch connector,现发布于git ...