事件兼容性处理

1.添加事件
一般来说有三种方式addEventListener、attachEvent、on

        addHandler: function(element,type,handler){  //添加事件
            if(element.addEventListener){
                element.addEventListener(type,handler,false);
            }else if(element.attachEvent){
                element.attachEvent("on"+type,handler);
            }else{
                element["on"+type]=handler;
            }
        },

attachEvent是IE特有的方法
现在使用on和addEventListener比较多
on 和其他两种不同的是 on事件只能绑定一个方法,多次绑定会被替换,其他的不会

2.获取event对象

event?event:window.event

3.获取target(当前html对象)

event.target||event.srcElement

4.阻止事件冒泡

if(event.preventDefault){
    event.preventDefault();
}else {
    event.returnValue=false;
}

5.移除事件
移除事件讲究比较多,如果你添加的事件方法不是命名方法,那么你很难直接移除该事件;
移除方法需要有指向方法的指针,匿名方法是没有玩意的

element.addEventListener("click",function(){

},false);

像这样写的就不要想着去移除了

6.获取相关元素

if(event.relatedTarget){
    return event.relatedTarget;
}else if(event.toElement){
    return event.toElement;
}else if(event.fromElement){
    return event.fromElement;
}else{
    return null;
}

使用场景还是比较少的

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  •   JavaScript 与 HTML 之间的交互是通过事件实现的。   事件,就是文档或浏览器窗口中发生的一些特...
    霜天晓阅读 3,687评论 1 11
  • 以下文章为转载,对理解JavaScript中的事件处理机制很有帮助,浅显易懂,特分享于此。 什么是事件? 事件(E...
    jxyjxy阅读 3,166评论 1 10
  • 一般版 精炼版
    阿古瓜阅读 596评论 0 1
  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 28,803评论 1 45
  • 什么是事件: 我们可以简单的把事件理解为浏览器的感知系统。比如说:他可以感觉到用户是否点击(click)了页面、鼠...
    张松1366阅读 7,000评论 1 6

友情链接更多精彩内容