2 leafage m Leafage_M 于 2016.09.20 20:57 提问

关于javascript 中的addLoadEvent重复实现函数问题

最近学习javascript的时候看的Javascript DOM编程艺术,中间作者提到了addLoadEvent()
函数,用来在页面加载完成后调用函数。
但发现有个函数会调用两次,求解答。
html文件代码:

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <title>Hello</title>
    </head>
    <body>
        <script src="../script/addLoadEvent.js"></script>
        <script src="../script/new_file.js"></script>
        <script src="../script/new_file1.js"></script>
    </body>
</html>

js代码:

addLoadEvent.js

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

new_file.js代码:

 function fun1() {
    alert("fun1");
}


addLoadEvent(fun1);

new_file1.js代码:

 function fun2() {
    alert("fun2");
}

addLoadEvent(fun2);

运行时,会出现两次fun1 一直不懂,求大神解答

3个回答

guwei4037
guwei4037   Ds   Rxr 2016.09.20 21:25
已采纳

function addLoadEvent(func) {
var oldonload = window.onload;
if(typeof window.onload != 'function') {
window.onload = func;
} else {
window.onload = function() {
oldonload();
func();//如果已经绑定了函数,就把新函数追加到现有指令的末尾
}
}
}

注意else部分是window.onload.

Leafage_M
Leafage_M 谢谢,
接近 2 年之前 回复
devmiao
devmiao   Ds   Rxr 2016.09.20 21:02
Leafage_M
Leafage_M 不好意思,是我没看清,谢谢了
接近 2 年之前 回复
Leafage_M
Leafage_M 我明白这个函数的实现原理,刚才发现如果在调用的时候在函数的后面加上(),例如addLoadEvent(fun1())的情况下不会重复调用,这是为什么的?
接近 2 年之前 回复
Leafage_M
Leafage_M   2016.09.20 21:08

如果将addLoadEvent(fun1),修改成addLoadEvent(fun1()); 这样第一个绑定的函数就不会重复调用,这是为什么呢?fun1和fun1()有什么区别呢?

Csdn user default icon
上传中...
上传图片
插入图片
准确详细的回答,更有利于被提问者采纳,从而获得C币。复制、灌水、广告等回答会被删除,是时候展现真正的技术了!
其他相关推荐
Javascript的addLoadEvent函数的使用详解
为了解决window.onload的弊端,javascript中可以通过一下方案解决。 函数如下: function addLoadEvent(func){ var oldonload=window.onload; if(typeof window.onload!='function'){ window.onload=func; }else{ window.o
JavaScript addLoadEvent函数使用详解
在HTML文档完成加载之前,DOM是不完整的。此时如果执行js代码,测试的准确性就无从谈起,所以我们必须让这个函数在网页加载完毕之后才得到执行。我们常用的方法就是: window.onload = 某个函数; 注:这条浅显易懂语句可以使用,但有时不太适用(当页面加载完成需要执行多个函数时)假设我们有两个函数,firstFunction()和secondFunction(),如果我想让他们俩都在页
addLoadEvent函数在页面加载后同时执行多个函数
问题来源 假如要在页面加载完毕后立即执行一个函数,我们使用window.onload事件即可完成任务。具体来说,网页加载完毕后会出发一个onload事件,该事件和window对象相关联。比如我们想要在页面加载完毕后立即某个函数,可以这么写:window.onload = someFunction();它虽然解决了我们的问题,但这样还不够完美。假设我们有两个函数:firstFuction和seco
addLoadEvent
function addLoadEvent(func) {     var oldonload = window.onload;     if (typeof window.onload != function) {         window.onload = func;     }    else {         window.onload = function() {       
多个js中如何避免方法名重复
我想很多人面试的时候都会遇到这个问题,在最开始进入it行业的时候其实我也不懂该怎么回答,后来很多人告诉我用闭包,然后再有面试我就直接回答闭包,但其实我自己并不是太明白闭包的概念,也根本不了解它是如何来防止方法名的重复,下面我就简单讲解下我所了解的。 先谈谈闭包的概念,其实闭包就是能够读取其他函数内部局部变量的函数,由于在js函数中,只有函数内部的函数才可以读取局部变量,因此可以把闭包简单的理解为
脚本收集 js的 addLoadEvent(func)函数
addLoadEvent(func)函数 详解: 1)当网页加载结束时候会触发一个onload事件, 当我们需要展现内容的时候就可以和Window对象相关联  即: window.onload = function;  //function即为需要绑定的函数  将这一句写在js文件或者页面中的里面即可 2)当onload需要多个事件的时候就就只会执行最后绑定的那个
JavaScript 重名的函数和对象
JavaScript 允许重复声明变量,后声明的覆盖之前的。var a = 1; var a = 'x'; console.log(a); //输出'x'JavaScript允许重复定义函数。 JavaScript没有重载这个概念,它仅依据函数名来区分函数。 后定义的同名函数覆盖之前的,与参数无关。 function test() { console.log("test"); } test(
对于addLoadEvent()的简单解析
function addLoadEvent(func){ var oldonload=window.onload; if(typeof window.onload!='function'){ window.onload=func; } else{ window.onload=function(){ oldonload(); func(); } } } 1.先
共享onload事件,封装一个addLoadEvent函数实现页面加载完毕时执行函数
window.onload=function(){}确实能够实现页面加载完毕时执行函数,在需要绑定的函数不是很多的场合,这是最简单的解决方案了。 这里还有一个弹性最佳的解决方案,不管你页面加载完毕时执行多少个函数,它都可以应付自如,封装这个函数的名字为addLoadEvent,他只有一个参数:打算在页面加载完毕时执行的函数名。 思路: 1、把现有的window.onload事件处理函数的值存
关于采用静态链接编译生成EXE库函数重复定义问题
看了好多关于类似LIBCMT.lib(invarg.obj) : warning LNK4006: ___pInvalidArgHandler already defined in libcmtd.lib(invarg.obj); second definition ignored的问题解决方法,但由于个人用的是VS2012所以原理虽然差不多,但操作步骤略有不同。 错误: LIBCMT.lib