100分问一个在javascript中操作dom时用innerHTML不能复制子节点事件的问题!!!!!!!!!


//ps: 变量不要用关键字，比如new 
下面调试通过<script>
var CopyNode = function(){
var   objOld = document.getElementById("old"); 
var   objNew = document.getElementById("new");

objNew.innerHTML = objOld.innerHTML;
};
</script><div id="new"></div>
<div id="old">
   <img src="http://www.baidu.com/img/logo.gif" onclick="alert(this.parentNode.id)" />
</div>
<input type="button" value="复制old到new" onclick="CopyNode()" />

解决方案 »

  1.   

    楼主动态添加的img元素的onclick事件是如何写入的，估计是跟这个有关系。如果是直接<img src=xxx onclick=xxx />这样就一定行，但如果是另外两种方式，就可能。我没试过。
      

  2.   

    楼主的情况,onclick事件肯定不是在html里定义的~~~其实如果只是onclick处理也不复杂~~<script>
    window.onload=function(){
        var old=document.getElementById("old");
        var _new=document.getElementById("new");
        var img=document.createElement("img");
        img.onclick=function(){alert();};
        img.src="http://community.csdn.net/ui/scripts/Csdn/_resources/FrameMDI/group.gif";
        old.appendChild(img);    _new.innerHTML=old.innerHTML;
        addEvent(old,_new);
    }
    function addEvent(a,b){
        var a_imgs=a.getElementsByTagName("img");
        var b_imgs=b.getElementsByTagName("img");
        for(var i=0,j=a_imgs.length;i<j;i++){
            b_imgs[i].onclick=a_imgs[i].onclick;
        }
    }
    </script>
    <div id="old"></div>
    <div id="new"></div>
      

  3.   

    对了,我是通过img.onclick=function(){}这样来赋予click事件的然后appendChild到了old里然后new.innerHTML=old.innerHTML~~~~~new里面的img元素确实没有响应onclick
      

  4.   

    遍历 old里的子元素 childNodes 依次appendChild加入new 
      

  5.   

    img.onclick=function(){}这样赋予click事件只是向浏览器注册了onclick事件而已,并没有生存html代码,所以你使用old.innerHTML来给id为new的div复制内容的话并没有img的事件处理.所以无法响应.....
    所以只能new=old.cloneNode(true); 
    或者参考3楼的代码把事件函数copy一下
      

  6.   

    哇塞!!非常好~~~~~~~~~~~~~~~~~~~~~~~~~~~~`3楼的方法行之有效果~~~~~~不过奇怪了new=old.cloneNode(true);这样就不行,new连外观都没了~~~