共享onload事件
在做前端工作中,我们想要设置某个函数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事件的更多相关文章
- 原生javascript 共享onload事件
在工作时,我们给一个元素绑定了事件,如果dom还没加载完成,就执行了js代码,就不会绑定成功.常规解决方案就是用: window.onload = EventFunction; 可是如果有两个 事件, ...
- js共享onload事件
问题:通过js进行事件绑定,必须在HTML文档加载完成后再执行js脚本,否则可能因DOM不完整导致无法完成预计的效果,但对于不同的需求如何选用最佳的实现方式呢,这里做了整理,可以做参考. 一.对于小型 ...
- 利用 onload 事件监控跨站资源
用过 CSP 的都很郁闷,上报的只有违规的站点名,却没有具体路径.这是缺陷,还是特意的设计? 显然,CSP 是为安全定制的,里面的规范自然要严格制定,否则就会带来新的安全问题.如果支持详细路径的上报, ...
- 【XSS】利用 onload 事件监控流量劫持
说到跨站资源监控,首先会联想到『Content Security Policy』.既然 CSP 好用,我们何必自己再搞一套呢.那就先来吐槽下 CSP 的缺陷. 目前的 CSP 日志不详细 用过 CSP ...
- JavaScript 中 onload 事件绑定多个方法
当需要调用的方法较多时,我们可以进一步优化,编写一个专门用于绑定 onload事件的方法: function addLoadEvent(func) { //把现有的 window.onload 事件处 ...
- jQuery $(document).ready()和JavaScript onload事件
jQuery $(document).ready()和JavaScript onload事件 Why we need a right time? 对元素的操作和事件的绑定需要等待一个合适的时机,可以看 ...
- onload事件-----addLoadEvent函数
在给网页加一些特效时经常要在<body>中加入“onload”事件,即在网页加载完后执行某事件,例如:<body onload=”alert(‘欢迎光临!')”,但这样做有个大的缺陷 ...
- javascript中onload事件如何绑定及执行顺序
onload事件,顾名思义就是为了js程序能够在网页加载成功过后进行执行.对于放在head里面的js来说,非常必要. 如何给网页绑定onload,主要有三种方式: window.onload=func ...
- jQuery的document ready与 onload事件——你真的思考过吗?
在进行实验和资料查询时,我遇到了几个关键问题: 1. window.onload到底是什么加载完触发? 2. body为什么会有onload事件? 3. 为什么是window.onload,而不是do ...
随机推荐
- dict
1.创建新字典(根据语法和dict初始化方法) >>> my_dict={'a':1,'b':2,'c':3} >>> my_dict=dict({'a':1,'b ...
- JSP编译原理图解
- CentOS上yum安装JDK
转: http://blog.csdn.net/onepiecehuiyu/article/details/17189571
- NewQuant的设计(二)——MatrixComputation的领域分析
NewQuant的设计——MatrixComputation的领域分析 MatrixComputation是NewQuant中最重要也是最大的一个模块,这个模块的领域分析要从回答几个问题开始. 一.矩 ...
- 安装sql2008的时候选择的是Windows身份验证,现在我想用sql server身份验证,我应该到哪儿设置呢
本文档整理自网络,存粹用作笔记. 安装过程中,SQL Server 数据库引擎可以设置为 Windows 身份验证模式或 SQL Server 和 Windows 身份验证模式. 本文介绍如何在安装后 ...
- OpenResty 是一个全功能的 Web 应用服务器
OpenResty (也称为 ngx_openresty)是一个全功能的 Web 应用服务器.它打包了标准的 Nginx 核心,很多的常用的第三方模块,以及它们的大多数依赖项. 通过众多进行良好设计的 ...
- 内网透过公网nginx和vpn实现微信接口调试
条件: 1.公网IP开放80/443端口 2.vpn,我熟悉openvpn 3.nginx反向代理 1.在公网服务器上装nginx和vpnserver 2.本地调试电脑装vpnclient,mac o ...
- SQL Server中的锁 详解 nolock,rowlock,tablock,xlock,paglock
摘自: http://www.myexception.cn/sql-server/385562.html 高手进 锁 nolock,rowlock,tablock,xlock,paglock 锁 no ...
- Access 数据库连接 字符串
<!--Microsoft.Practices.EnterpriseLibrary.Data.dll 操作引用程序集--> <connectionStrings> <ad ...
- MySQL三大数据类型