手机
当前位置:查字典教程网 >编程开发 >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问题解决方法】相关文章:

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

跨浏览器的设置innerHTML方法

javascript先序遍历DOM树的方法

js光标定位文本框回车表单提交问题的解决方法

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

JavaScript判断数组是否包含指定元素的方法

jquery读取xml文件实现省市县三级联动的方法

Jquery动态添加输入框的方法

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

JavaScript中Number.MAX_VALUE属性的使用方法

精品推荐
分类导航