美文网首页我爱编程
event 对象的兼容

event 对象的兼容

作者: 谢大见 | 来源:发表于2018-03-16 09:36 被阅读0次

即使使用jquery,还是要做兼容的,其实,只有在jquery封装的事件方法里使用event才可以不考虑兼容

1. event

IE:直接使用event就行,为保险起见,写成window.event;
FF:window.event要报错,提示undefined,经查询,发现要用参数引导才能使用;
原生js兼容写法:

function foo(event){
    var evt = event || window.event;
}

如果有引入jquery:

$(".btn").click(function(event){
    alert(event.type);
})

2. event.target属性: 获取触发事件的元素对象

原生js:
function foo(event){
  var evt = window.event||event;
  var targetObj = evt.target||evt.srcElement;
}

jquery写法:

$(".btn").click(function(event){
    alert(event.target);
})

3.event.preventDefault 阻止事件默认行为

event.preventDefault ? (event.preventDefault()) : (event.returnValue = false);

4.event.stopPropagation 阻止事件冒泡

event.stopPropagation ? (event.stopPropagation()) :  (event.cancelBubble = true);

5.addEventListener

 // 添加事件
        if (element.addEventListener) {  
            element.addEventListener(type, hanlder, false);  
        }  
        else if (element.attachEvent) {  
            element.attachEvent('on' + type, hanlder);  
        }  
        else {  
            element['on' + type] = hanlder;  
        }  

   // 删除事件  
        if (element.removeEventListener) {  
            element.removeEventListener(type, hanlder, false);  
        }  
        else if (element.detachEvent()) {  
            element.detachEvent('on' + type, hanlder);  
        }  
        else {  
            element['on' + type] = null;  
        }  

相关文章

  • JS事件 Event

    获得event对象兼容性写法 :event || (event = window.event); 获得target...

  • event

    1. 事件对象的获取 var event = event || window.event; // 兼容写法, i...

  • event 对象的兼容

    即使使用jquery,还是要做兼容的,其实,只有在jquery封装的事件方法里使用event才可以不考虑兼容 1....

  • 事件对象及实例

    事件对象: event兼容性: 兼容 Chrome IE系列 不兼容FireFox在FF里: ev ...

  • js事件1 event对象 事件冒泡

    1 什么是event对象 用来获取时事件的详细信息:鼠标位置,键盘位置 2 获取event对象(兼容性写法) va...

  • day11-事件

    1. 事件对象兼容(兼容IE) e = e || window.event; 2. 鼠标事件及方法; 属性名 ...

  • 47种常见的浏览器兼容性问题大汇总

    浏览器兼容性问题大汇总Ø JavaScript HTML对象获取问题 const问题 event.x与event....

  • JavaScript兼容

    // 属性的兼容,使用||解决// 方法的兼容,使用if判断解决 event事件获取兼容 注意:event需要逐层...

  • js事件

    1.事件 (1)事件对象的兼容性写法 event对象常用属性 三个事件的重要坐标: clientX clien...

  • js网页特效(四)事件

    1.事件 (1)事件对象的兼容性写法 event对象常用属性 三个事件的重要坐标: clientX clien...

网友评论

    本文标题:event 对象的兼容

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