手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >关于innerHTML后丢失动态绑定的EVENT问题解决方法
关于innerHTML后丢失动态绑定的EVENT问题解决方法
摘要:用innerHTML取出一段内容后再innerHTML回去,那么原来动态绑定的事件就会丢失,如:html:复制代码代码如下:点击script...

用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)}

}

这也是折中的方法,肯定会影响效率的。

【关于innerHTML后丢失动态绑定的EVENT问题解决方法】相关文章:

js动态创建及移除div的方法

Jquery注册事件实现方法

JavaScript实现表格点击排序的方法

js获取滚动距离的方法

jQuery实现页面内锚点平滑跳转特效的方法总结

JS选项卡动态替换banner图片路径的方法

JQuery boxy插件在IE中边角图片不显示问题的解决

jQuery判断指定id的对象是否存在的方法

jQuery实现将页面上HTML标签换成另外标签的方法

Jquery动态添加输入框的方法

精品推荐
分类导航