zoukankan      html  css  js  c++  java
  • javaScript中的事件三

    javaScript中的事件三

    先看两种错误的写法,他们的目的都是:添加两个事件;

    错误方式一:

      window.onload=function (){
        alert('event 1');  
      }
      window.onload=function (){
        alert('event 2')  
      }

    错误方式二:

    window.onload=function (){
        var obj=document.getElementById("but");
        obj.onclick=function(){
         alert('event 1');    
        }
        obj.onclick=function(){
         alert('event 2');    
        }
      }

    结果他们弹出的都是 event 2

    正确的写法:(ie下的attachEvent 事件顺序还是有问题的,有待优化)

     function addEvent(obj,eventName,fn){
         //还要考虑到兼容性的问题
         if(obj.attachEvent!=undefined){
            //这个是ie下面的
            obj.attachEvent('on'+eventName,fn);
            //这里还值得注意的是在ie6-8 中事件事件的顺序和你注册的事件时相反的呀
            //还有在ie下的事件是有 on 关键字滴呀
            //在ff 和chrome 中是没有的
         }else{
            //这个是chrome 和ff 下的
            obj.addEventListener(eventName,fn,false);
         }
     }
     
      window.onload=function (){
        var obj=document.getElementById("but");
        addEvent(obj,'click',function (){
            alert('event 1');    
        });  
        addEvent(obj,'click',function (){
            alert('event 2');    
        });
      }

    事件可以绑定,那么事件就是可以解除滴呀;解除的方式如下:

    //这里是我们的注册事件
     function addEvent(obj,eventName,fn){
         //还要考虑到兼容性的问题
         if(obj.attachEvent!=undefined){
            //这个是ie下面的
            obj.attachEvent('on'+eventName,fn);
            //这里还值得注意的是在ie6-8 中事件事件的顺序和你注册的事件时相反的呀
            //还有在ie下的事件是有 on 关键字滴呀
            //在ff 和chrome 中是没有的
         }else{
            //这个是chrome 和ff 下的
            obj.addEventListener(eventName,fn);
         }
     }
     //这是我们额取消事件的呀
      function subEvent(obj,eventName,fn){
          if(obj.attachEvent!=undefined){
              obj.detachEvent('on'+eventName,fn);
          }else{
              obj.removeEventListener(eventName,fn);
          }
      }
      function alertA(){
        alert('event 1');  
      }
      function alertB(){
        alert('event 2');  
      }
      window.onload=function (){
        var obj=document.getElementById("but");
        addEvent(obj,'click',alertA);  
        addEvent(obj,'click',alertB);
        
        //如果我们执行下面的方法,那么我们取消了注册的事件滴呀
        subEvent(obj,'click',alertA);
        subEvent(obj,'click',alertB);
        
      }
      

    还有有一个事件捕获的概念(仅仅在我们的ie中才有的事件滴呀)

     window.onload=function (){
         var obj=document.getElementById("but");
         obj.onclick=function (){
            alert('click event '); 
         }
         //这个东西只能在ie中使用滴呀
         obj.setCapture();
         //接下来,你在页面的中任何地方执行一个onclick事件,
         //该事件都会在button中进行触发的呀,这个就是我们的事件捕获滴呀
     }

     释放捕获的方法:

    obj.releaseCapture();

  • 相关阅读:
    Beyond Compare 4破解有效方案
    C#调用API实现程序间相互控制(附源码)
    IOS7使用吐槽(抛弃拟物化您还能走多远.........)
    随话web编程与淘宝
    错误应用程序 iexplore.exe,版本 6.0.2900.2180,错误模块 mshtml.dll
    SQL基础语句总结
    Windows Image Acquisition (WIA) 服务在启动时暂停
    点击按钮后变灰提交页面
    我看IE与FFJs读取xml文件
    ABAPALV(3)
  • 原文地址:https://www.cnblogs.com/mc67/p/5205327.html
Copyright © 2011-2022 走看看