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();

  • 相关阅读:
    调用Mapreduce,org.apache.hadoop.hbase.mapreduce处理hbase问题
    mysql用视图和事件实现数据间隔插入数据到表
    mysql自定义函数实现数据正则处理
    ambari安装Zeppelin Notebook提示ES源找不到问题解决
    IDEA 进行编译代码的时候,报错误Error:scalac: IO error while decoding .* with GBK
    Linux最大线程数限制及当前线程数查询
    rhel log 日志时间戳时间不对更改方法
    usb禁用验证
    CentOS 7 下挂载NTFS文件系统并实行开机自动挂载
    linux 判定那块网卡为eth0 eth0对应的物理网卡闪灯30秒
  • 原文地址:https://www.cnblogs.com/mc67/p/5205327.html
Copyright © 2011-2022 走看看