[转]添加事件监听

Posted 2020-08-09

我们在制作网页时，常常要制作一些js控件。各js控件虽然制作出来后，但有时要在一起使用时，调用到同样的事件就会引起冲突。 如editselectunit和editselectrole控件同时使用到了document的onclick事件。此时，如果在这两个事件的<script language=‘javascript‘></script>处分别编写如下document.onclick = function() { alert(‘unit‘);};

documnet.onclick=function {alert(‘role‘);}，则上述代码只有一个document.onclick事件会起作用。如先声明

var role = new editSelectRole();

var unit = new editSelectUnit();

则role中的document.onclick()将起作用，有点先来先得的味道。unit中的document.onclick()将不起作用; 

那么如何使得这两个控件均能使用documnet.onclick（）事件呢？答案是在这两个控件中分别添加事件监听。在ie中

我们使用attachEvent，在非IE的浏览器中使用addEventListener来实现。

如editSelectUnit控件中添加onclick()，其代码如下：

     var clickHandler = function()
      {
           with(window.event)
         {  
             //  alert( document.all(activetxtPopup_Unit).name);
             if (srcElement != document.all(activetxtPopup_Unit))
          {
            document.all(activeContainer_Unit).style.display = ‘none‘ ;
          }
         }
      } 
    
     if (navigator.appVersion.indexOf("MSIE") != -1)
    {   // IE用attachEvent
        document.attachEvent("onclick", clickHandler);            
    }
    else
    {   // 非IE用addEventListener
        document.addEventListener("click", clickHandler, false);  
    }

 

而editSelectRole控件中添加onclick()，其代码如下：

//任意点击时关闭该控件 //ie6的情况可以由下面的切换焦点处理代替  
  var clickHandler = function()
  {  
       with(window.event)
     { 
        // alert( document.all(activetxtPopup_Role).name);    
         if (srcElement != document.all(activetxtPopup_Role))
       document.all(activeContainer_Role).style.display = ‘none‘ ;
     }
  } 
    
     if (navigator.appVersion.indexOf("MSIE") != -1)
    {   // IE用attachEvent
        document.attachEvent("onclick", clickHandler);            
    }
    else
    {   // 非IE用addEventListener
        document.addEventListener("click", clickHandler, false);  
    }