zoukankan      html  css  js  c++  java
  • JS事件绑定深入

      W3C很好地解决了覆盖问题、相同函数屏蔽的问题、this传递问题、添加额外方法不被覆盖等问题。

      但是IE8之前的版本并不支持,IE9已完全支持了。

      IE和W3C在事件绑定上存在很多差异,我们以冒泡和捕获为例来介绍。

      W3C支持冒泡和捕获方式,而IE不支持捕获。

      IE有自己的事件绑定机制,通过attachEvent和deleteEvent函数来实现。

      首先,介绍IE解决覆盖问题的办法。

    window.attachEvent('onload',function(){
        alert('Lee');
    });
    
    window.attachEvent('onload',function(){
        alert('Mr.Lee');
    });
    
    window.attachEvent('onload',function(){
        alert('Miss.Lee');
    });

      输出Miss.Lee,Mr.Lee,Lee。看来,通过attachEvnet解决了覆盖问题,但输出顺序反了过了。

      其次,IE不能解决相同函数屏蔽问题,即无法屏蔽,在团队开发中相同函数要注意这个问题。

      接着,IE是否可以传递this呢?

    window.attachEvent('onload',function(){
         var box=document.getElementById('box');
         box.attachEvent('onclick',function(){
        alert(this);
        });
    });

      输出结果为object,其实为window对象,而不是box,看来IE不能传递this。

      为了解决这个问题,大家也许会想到用匿名函数call过去,但匿名函数可读性不强,不是很推荐。

      我们用事件函数来解决。若我们为box标签对象添加了事件,可以通过如下方法得到box。 

     var that =window.event.srcElement;

      最后,如何做W3C和IE事件切换器的全套兼容呢?

      详见http://edu.51cto.com/lesson/id-9553.html;

      重点:跨浏览器添加事件,移除事件,阻止事件等。

      

      

      

  • 相关阅读:
    Go 命令行参数,JSON 序列化与反序列化
    Go 文件操作
    Go 多态
    Go 接口
    Go 面向对象三大特性
    Go 面向对象编程应用
    Go 结构体方法
    Go 面向对象之结构体
    Go Map
    vue安装 vue-cli安装
  • 原文地址:https://www.cnblogs.com/tangzhirong/p/4827310.html
Copyright © 2011-2022 走看看