首页 > 编程语言 > 详细

javascript学习—理解addLoadEvent函数

时间:2021-03-05 09:55:54      阅读:24      评论:0      收藏:0      [点我收藏+]

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

window.onload = func的作用就是在页面加载完成后将func函数绑定到onload事件上并执行。如果页面加载完成之后,只需要执行一个函数func,那么只用window.onload = func也就可以了,但是如果需要执行两个甚至多个函数呢?

直接调用两次onload不就行了:

window.onload=firstfunction;
window.onload=secondfunction;

这么做的话,只有secondfunction会被绑定,因为前面的值被后面的值覆盖了。那么该怎么办?

将两个函数合并到一个函数当中不就行了,匿名函数发挥作用的时候到了:

window.onload = function() {
    fristfunction;
    secondfunction;
}

不过,它也只能绑定两个函数。还好,大神们早已解决了这个问题。西蒙·威利森 (Simon Willison)——jQuery框架的开发者之一编写了下面的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);
addLoadEvent(thirdfunction);
...

 

javascript学习—理解addLoadEvent函数

原文:https://www.cnblogs.com/aaaazzzz/p/14484062.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!