美文网首页
事件对象

事件对象

作者: IvyAutumn | 来源:发表于2018-12-10 09:19 被阅读0次

什么是事件对象?在触发DOM上的事件时都会产生一个对象

事件对象event

DOM中的事件对象

(1) type属性用于获取事件类型
(2) target属性用于获取事件目标
(3)stopPropagation()方法用于阻止时间冒泡
(4)preventDefault()方法阻止事件的默认行为

IE中的事件对象

(1)type属性用于获取事件类型
(2)srcElement属性用于获取事件的目标
(3)cancelBubble属性用于阻止时间冒泡
设置为true表示阻止冒泡;设置为false表示不阻止冒泡
(4)returnValue属性用于阻止事件的默认行为
设置为false表示阻止事件的默认行为
在代码的时候要注意考虑IE浏览器的兼容性,一般将一些常用行为封装起来

//跨浏览器的处理方法:封装在一个对象中
var eventUtil = {
            //添加句柄
            addHandler:function(element, type, handler){
                if(element.addEventListener){
                    element.addEventListener(type,handler,false)//DOM2级事件处理
                }else if(element.attachEvent){
                    element.attachEvent('on'+type,handler);//IE浏览器事件处理
                }else{
                    element['on'+type]=handler;//DOM0级事件处理
                }
            },
            //删除句柄
            removeHandler:function(element, type, handler){
                if(element.removeEventListener){
                    element.removeEventListener(type,handler,false)//DOM2级事件处理
                }else if(element.detachEvent){
                    element.detachEvent('on'+type,handler);//IE浏览器事件处理
                }else{
                    element['on'+type]=handler;//DOM0级事件处理
                }
            },
            getEvent:function(event){
                return event?event:windows.event;
            },
            getType:function(event){
                return event.type;
            },
            getElement:function(event){
                return event.target || event.srcElement;
            },
            preventDefault:function(event){
                if(event.preventDefault){
                    event.preventDefault();
                }else{
                    event.returnValue=false;
                }
            },
            stopPropagation:function(event){
                if(event.stopPropagation){
                    event.stopPropagation();
                }else{
                    event.cancelBubble=true;
                }
            }
}

相关文章

  • JavaScript事件03——事件对象

    大纲:事件对象(DOM中的事件对象,IE中的事件对象,跨浏览器) 一、事件对象 什么是事件对象? 在触发DOM上的...

  • 【事件】事件对象

    触发DOM上的某个事件时,会产生一个事件对象event,这个对象中包含着所有与事件有关的额信息。(包括导致事件的元...

  • 事件对象

    事件对象:当触发某种事件时,可以获取一个对象,该对象与触发的事件是相关的,我们把他们称之为事件对象 事件对象也是一...

  • dom事件对象

    事件定义 常见事件 常见绑定方法 事件对象 鼠标键盘事件对象

  • 原生事件对象

    事件对象: 每当触发事件时,就会产生一个事件对象(不管是DOM 0 还是DOM2 都有事件对象)[ 事件对象操作的...

  • 事件

    1. 注册事件 事件监听方式: 2. 删除事件 3. 事件对象 3.1事件对象使用语法 3.2 事件对象的常见属性...

  • JavaScript(二)

    JavaScript对象 事件对象 type获取事件类型,显示事件为点击事件click target 获取事件目标...

  • this和e.target的异同

    简单分析 每次触发DOM事件时会产生一个事件对象(也称为event对象),此处的参数接收事件对象,而事件对象也有很...

  • 事件对象

    什么是事件对象?在触发DOM上的事件时都会产生一个对象 事件对象event DOM中的事件对象 (1) type属...

  • VC++(十六)线程同步与异步套接字编程

    事件对象也属于内核对象,分为两种:人工重置的事件对象和自动重置的事件对象。 当人工重置的事件对象得到通知时,等待该...

网友评论

      本文标题:事件对象

      本文链接:https://www.haomeiwen.com/subject/gnmqhqtx.html