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

这个方法可以解决我的问题,但是,如果我有两个函数firstfunc和secondfunc,我想让他们两个都在页面加载完成后得到执行,我该怎么做呢?

window.onload=firstfunc;

window.onload=secondfunc;

像这样逐一绑定,运行结果是secondfunc将会取代firstfunc,我们会这样想,既然每个事件处理函数只能绑定一条指令,那我可以这样来做,我先创建一个匿名函数来容纳这两个函数,然后把匿名函数绑定到onload事件上,如下所示:

window.onload=function(){

    firstfunc();

    secondfunc();

}

它确实能很好地工作-----在需要绑定的函数不是很多的场合,这是最简单的解决方案。

下面我给大家分享一种最近学到的很有弹性的解决方案,这个方案需要额外多写代码,写了这些代码,把函数绑定到onload事件就很简单了,函数如下:

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

当需要绑定某个函数到onload事件上时,只需要调用这个函数:addLoadEvent(函数名);即可。

共享onload事件的更多相关文章

  1. 原生javascript 共享onload事件

    在工作时,我们给一个元素绑定了事件,如果dom还没加载完成,就执行了js代码,就不会绑定成功.常规解决方案就是用: window.onload = EventFunction; 可是如果有两个 事件, ...

  2. js共享onload事件

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

  3. 利用 onload 事件监控跨站资源

    用过 CSP 的都很郁闷,上报的只有违规的站点名,却没有具体路径.这是缺陷,还是特意的设计? 显然,CSP 是为安全定制的,里面的规范自然要严格制定,否则就会带来新的安全问题.如果支持详细路径的上报, ...

  4. 【XSS】利用 onload 事件监控流量劫持

    说到跨站资源监控,首先会联想到『Content Security Policy』.既然 CSP 好用,我们何必自己再搞一套呢.那就先来吐槽下 CSP 的缺陷. 目前的 CSP 日志不详细 用过 CSP ...

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

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

  6. jQuery $(document).ready()和JavaScript onload事件

    jQuery $(document).ready()和JavaScript onload事件 Why we need a right time? 对元素的操作和事件的绑定需要等待一个合适的时机,可以看 ...

  7. onload事件-----addLoadEvent函数

    在给网页加一些特效时经常要在<body>中加入“onload”事件,即在网页加载完后执行某事件,例如:<body onload=”alert(‘欢迎光临!')”,但这样做有个大的缺陷 ...

  8. javascript中onload事件如何绑定及执行顺序

    onload事件,顾名思义就是为了js程序能够在网页加载成功过后进行执行.对于放在head里面的js来说,非常必要. 如何给网页绑定onload,主要有三种方式: window.onload=func ...

  9. jQuery的document ready与 onload事件——你真的思考过吗?

    在进行实验和资料查询时,我遇到了几个关键问题: 1. window.onload到底是什么加载完触发? 2. body为什么会有onload事件? 3. 为什么是window.onload,而不是do ...

随机推荐

  1. centos安装sublime

    在官网下载,tarball    下载链接        http://www.sublimetext.com/3 提示信息:  Ubuntu 64 bit - also available as a ...

  2. Docker 官网信息

    Docker Engine Docker-for-linuxhttps://docs.docker.com/engine/installation/linux/rhel/https://docs.do ...

  3. Java 使用线程方式Thread和Runnable,以及Thread与Runnable的区别

    一. java中实现线程的方式有Thread和Runnable Thread: public class Thread1 extends Thread{ @Override public void r ...

  4. linux下shell编写九九乘法表

    主要语法:类似    1x2       echo   $((1*2)) for 变量 in 值1 值2 值3 ;do linux命令或者语句done

  5. IOS开发-图片上传

    目前IOS端开发,图片上传到服务器分为两种,一种是直接上到服务器,一种是借助第三方储存(减少服务器压力). 一.直接上传到服务器 /** * 代码演示 */ //*******UIImagePNGRe ...

  6. ajax请求获取的数据无法赋值给全局变量问题总结

    一.总结: 1.问题描述: 今天做项目遇到在用表单显示详细信息的过程中ajax请求获取的数据无法赋值给全局变量的情况,从列表页面进入详情页,在详情页面被渲染了之后就会调用js文件里的接口向服务器请求数 ...

  7. D3制作基础图表学习总结(part1)

    一.基本的环境搭建(和使用其他框架或js库一样) 1.建立一个工程: 2.在html文件中引入D3的文件: 附上git地址:https://github.com/d3/d3/wiki  二.建立图表 ...

  8. SVN代码回滚命令之---"svn up ./ -r 版本号"---OK

    一.改动还没被提交的情况(未commit) 这种情况下,见有的人的做法是删除work copy中文件,然后重新update,恩,这种做法达到了目的,但不优雅,因为这种事没必要麻烦服务端. 其实一个命令 ...

  9. 梦想还是要有的-纪念正式成为csdn博客专家暨年中总结

    csdn博客:http://blog.csdn.net/tuzongxun 我的csdn历程(坚持总会有收获):   一年零三个月之前,2015年3月3日,我在csdn写下第一篇技术博客,只是记录了一 ...

  10. 局部变量&&malloc函数&&生命周期的一些见解

    最近在温习指针的部分时发现了一个有趣的问题,先看以下程序: //1.c #include<stdio.h> int* fun() { int t = 567; return &t; ...