关于innerHTML后丢失动态绑定的EVENT问题解决方法


Posted in Javascript onMay 19, 2013

用innerHTML取出一段内容后再innerHTML回去,那么原来动态绑定的事件就会丢失,如:
html:

<body><div id='d1'>点击</div></body>

script:
document.getElementById('d1').onclick=function(){alert(1)}; 
var html=document.body.innerHTML; 
document.body.innerHTML=html;

这段代码执行后点击d1是没有任何反应的。
解决方法
把onclick绑定到父元素,利用冒泡原理,判断当前元素是否为d1,若为d1则执行
document.body.onclick=function(e){ 
var e=e||event; 
var current=e.target||e.srcElement 
if(current.id=='d1'){alert(1)} 
}

这也是折中的方法,肯定会影响效率的。
Javascript 相关文章推荐
单独使用CKFinder选择图片的方法
Aug 21 Javascript
javascript自适应宽度的瀑布流实现思路
Feb 20 Javascript
js中的this关键字详解
Sep 25 Javascript
现如今最流行的JavaScript代码规范
Mar 08 Javascript
jQuery实现移动端滑块拖动选择数字效果
Dec 24 Javascript
理解javascript正则表达式
Mar 08 Javascript
用vue和node写的简易购物车实现
Apr 25 Javascript
JS中去掉array中重复元素的方法
May 26 Javascript
随机生成10个不重复的0-100的数字(实例讲解)
Aug 16 Javascript
JavaScript 完成注册页面表单校验的实例
Aug 19 Javascript
详解微信小程序缓存--缓存时效性
May 02 Javascript
JavaScript运动原理基础知识详解
Apr 02 Javascript
JS特殊函数(Function()构造函数、函数直接量)区别介绍
May 19 #Javascript
JavaScript中几个重要的属性(this、constructor、prototype)介绍
May 19 #Javascript
js函数中onmousedown和onclick的区别和联系探讨
May 19 #Javascript
下拉菜单点击实现连接跳转功能的js代码
May 19 #Javascript
js操纵跨frame的三级联动select下拉选项实例介绍
May 19 #Javascript
固定背景实现的背景滚动特效示例分享
May 19 #Javascript
Jquery实现鼠标移上弹出提示框、移出消失思路及代码
May 19 #Javascript
You might like
PHP date函数参数详解
2006/11/27 PHP
基于PHP的cURL快速入门教程 (小偷采集程序)
2011/06/02 PHP
php中比较简单的导入phpmyadmin生成的sql文件的方法
2011/06/28 PHP
PHP计数器的实现代码
2013/06/08 PHP
PHP开发中常见的安全问题详解和解决方法(如Sql注入、CSRF、Xss、CC等)
2014/04/21 PHP
PHP提示Cannot modify header information - headers already sent by解决方法
2014/09/22 PHP
PHP使用逆波兰式计算工资的方法
2015/07/29 PHP
node.js chat程序如何实现Ajax long-polling长链接刷新模式
2012/03/13 Javascript
javascript里模拟sleep(两种实现方式)
2013/01/25 Javascript
ie8 不支持new Date(2012-11-10)问题的解决方法
2013/07/31 Javascript
JavaScript中使用typeof运算符需要注意的几个坑
2014/11/08 Javascript
JavaScript常用的返回,自动跳转,刷新,关闭语句汇总
2015/01/13 Javascript
如何减少浏览器的reflow和repaint
2015/02/26 Javascript
jQuery 检查某个元素在页面上是否存在实例代码
2016/10/27 Javascript
ajax分页效果(bootstrap模态框)
2017/01/23 Javascript
jQuery HTML css()方法与css类实例详解
2020/05/20 jQuery
Element InputNumber 计数器的实现示例
2020/08/03 Javascript
vue 单页应用和多页应用的优劣
2020/10/22 Javascript
[05:05]DOTA2亚洲邀请赛 战队出场仪式
2015/02/07 DOTA
Python中replace方法实例分析
2014/08/20 Python
Python实现的ini文件操作类分享
2014/11/20 Python
Python语言描述KNN算法与Kd树
2017/12/13 Python
Django框架组成结构、基本概念与文件功能分析
2019/07/30 Python
Pytorch Tensor的索引与切片例子
2019/08/18 Python
Python实现代码统计工具
2019/09/19 Python
浅谈python元素如何去重,去重后如何保持原来元素的顺序不变
2020/02/28 Python
python实现ftp文件传输系统(案例分析)
2020/03/20 Python
python--shutil移动文件到另一个路径的操作
2020/07/13 Python
CSS3 box-sizing属性
2009/04/17 HTML / CSS
css3给背景图片加颜色遮罩的方法
2019/11/05 HTML / CSS
台湾家适得:Homeget
2019/02/11 全球购物
英国办公家具网站:Furniture At Work
2019/10/07 全球购物
运动会通讯稿200字
2014/02/16 职场文书
公安个人四风问题对照检查及整改措施
2014/10/28 职场文书
2015年母亲节活动总结
2015/02/10 职场文书
一篇文章带你学习Mybatis-Plus(新手入门)
2021/08/02 Java/Android