动态生成层，并拖动层效果，在火狐上能行，但在ie有问题，问题我已在文中注释，请大虾们帮忙解决

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
 .drag{
width:262px;
height:134px;
padding:15px 0 0 15px;
background:url(img/drag.jpg);
position:absolute;
}
</style>
<script type="text/javascript">
 var iDiffx=0;
 var iDiffy=0;
 var i=0;
 var EventUtil=new Object;
 EventUtil.addEventHandler=function(oTarget,sEventType,fnHandler){
   if(oTarget.addEventListener){
      oTarget.addEventListener(sEventType,fnHandler,false);
  } 
else if(oTarget.attachEvent){//在ie中未实现监听
      oTarget.attachEvent("on"+sEventType,fnHandler);
  
      } 
  else {
         oTarget["on"+sEventType]=fnHandler;
 }
};
  EventUtil.removeEventHandler=function(oTarget,sEventType,fnHandler){
   if(oTarget.removeEventListener){
      oTarget.removeEventListener(sEventType,fnHandler,false);
  }
else if(oTarget.detachEvent){//在ie中未实现撤除监听
      oTarget.detachEvent("on"+sEventType,fnHandler);
   } 
  else {
         oTarget["on"+sEventType]=null;
 }
};
/*创建一个对象，定义内置函数来监听事件实现兼容ie和火狐*/  
function send(){  
      if(document.form1.comment.value=="")
   alert("您尚未输入留言，请留言");
  else {
     if(document.form1.comment.value.length>150)
   alert("请输入150字以内的留言");
 else {
     var meg=document.createElement("div");
  meg.className="drag";
  meg.id="div"+i;
  var id=meg.id;
  meg.innerHTML=document.form1.comment.value;
      document.body.appendChild(meg);
      document.form1.comment.value="";
  
  i++;
   var oDiv=document.getElementById(id);
   /*动态生成一个层，每生成层的id都加1，以使每个层的id都不同*/
   oDiv.onmousedown=function(event){     
   iDiffx=event.clientX-oDiv.offsetLeft;
    iDiffy=event.clientY-oDiv.offsetTop;
    EventUtil.addEventHandler(document.body,"mousemove",handleMouseMove);
    EventUtil.addEventHandler(document.body,"mouseup",handleMouseUp);
}
/*点击生成的层，实现函数，同时监听mousemove和mouseup调用的函数*/
    function handleMouseMove(event){//经测定该函数在ie中没有调用
    oDiv.style.left=(event.clientX-iDiffx)+"px";
        oDiv.style.top=(event.clientY-iDiffy)+"px";
     }
    function handleMouseUp(){//经测定该函数在ie中没有调用
     EventUtil.removeEventHandler(document.body,"mousemove",handleMouseMove);
 EventUtil.removeEventHandler(document.body,"mouseup",handleMouseUp);
   }
}
}
}

 </script>
</head><body>
 <p>Try dragging the red square onto the blue square.</p>
 <form name="form1">
  <textarea rows="10" cols="30" name="comment"></textarea>
  <input type="button" onmousedown="send()" id="button1" />
  </form>
 
</body>
</html>

解决方案 »

  1.   


    /*动态生成一个层，每生成层的id都加1，以使每个层的id都不同*/
                oDiv.onmousedown=function(event){ 
                    event = event || window.event;
                    iDiffx=event.clientX-oDiv.offsetLeft;
                    iDiffy=event.clientY-oDiv.offsetTop;
                    EventUtil.addEventHandler(document.body,"mousemove",handleMouseMove);
                    EventUtil.addEventHandler(document.body,"mouseup",handleMouseUp);
                }
                /*点击生成的层，实现函数，同时监听mousemove和mouseup调用的函数*/
                function handleMouseMove(event){//经测定该函数在ie中没有调用
                    event = event || window.event;
                    oDiv.style.left=(event.clientX-iDiffx)+"px";
                    oDiv.style.top=(event.clientY-iDiffy)+"px";
                }
      

  2.   

    加上event = event || window.event;
    IE获取事件对象使用全局变量window.event获取
      

  3.   

    oDiv.onmousedown=function(event){
    var ev = event || window.event;
    iDiffx=ev.clientX-oDiv.offsetLeft;
    iDiffy=ev.clientY-oDiv.offsetTop;有两处要这样修改才能兼容！
      

  4.   

    先去证明你EventUtil.addEventHandler的定义和调用 100%是正确的然后再测试拖动
      

  5.   

    function(e){
    兼容IE FF
    var theEvent=e.event?e.event:e.target;
    }