最近在调试项目的时候,发现IE和Chrome都显示正常,就是FireFox异常,F12查看控制台,发现报错:window.event is undefined。检查代码中定义的事件方法中获取事件对象直接使用的window.event,去掉window后,IE异常,但是FF正常,坑啊。。。想当然以为全局引入了jquery,就不用做这方面的兼容,其实,只有在jquery封装的事件方法里使用event才可以不考虑兼容,其他的自己写的方法即便会在jquery的事件里调用,还是要兼容。现在总结一下,以后备用。

1. event

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

function foo(event){
var evt = window.event||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);
})

event对象的兼容性的更多相关文章

  1. event对象和事件冒泡

    <!DOCTYPE HTML><html><head> <meta charset="utf-8"> <title>无标 ...

  2. 前端程序员的蜕变——JS的 event 对象属性、使用实例、兼容性处理(极大提高代码效率、减少代码量)

    下面讨论一下 js 中的 Event 对象,主要从以下三个方面详细的描述(点击标题可跳转到对应部分): 1.什么是event 2.怎么用event,用他该注意什么,几个简单实际应用 3.event在不 ...

  3. dom事件与event对象总结

    1 事件:就是文档或浏览器窗口中发生的一些特定的交互瞬间.    tips:js和xhtml的交互是通过当用户或浏览器操作网页时发生的事件来处理的. 1.1 事件流:即事件的顺序.        事件 ...

  4. 火狐和IE的window.event对象详解(转载)

    FF的FIREBUG,不仅能测试JS还能检查CSS错误,是一般常用的. 但它主要检查FF方面的错误,对IE就无能为力了. 要测试IE,就用ieTester,它可以测试IE几乎所有版本(1.0恐怕也用不 ...

  5. vue.js - 奇怪的 event 对象

    好久都没有写点东西了, 前段时间工作搞得头大,真的就是一起加班到死了.废话不多说,写这篇文章是因为这次因为 event 对象闹了一个乌龙,以此总结一下. 一.event 对象 (一)事件的 event ...

  6. Event 对象的属性和方法

    事件触发时,会将一个 Event 对象传递给事件处理程序,比如: document.getElementById("testText").addEventListener(&quo ...

  7. js中的Event对象

    event代表事件的状态,例如触发event对象的元素,鼠标的位置及状态,按下的键等等 event对象只在事件发生的过程中才有效. <!DOCTYPE html><html lang ...

  8. event对象的理解

    0.给对象绑定事件准确的说是给对象事件绑定事件函数 1.event:事件对象,当一个事件发生的时候,和当前这个对象发生的事件有关的信息都会被i临时保存到event对象中 2.event对象必须在一个事 ...

  9. 浏览器中event.srcElement和event.target的兼容性问题

    在IE下,event对象有srcElement属性,但是没有target属性:Firefox下,even对象有target属性,但是没有srcElement属性.. 解决方法:使用obj(obj = ...

随机推荐

  1. Linux 的歷史

    Unix 狹義作業系統提供應用程式及命令直譯器. 作業系統發展初期並不具可攜性. Bell, GE 及 MIT 合作開發的 "Multice" 系統( 相容分時系統 ). 1969 ...

  2. SSM框架快速搭建

    1.   新建Maven项目 ssm 2.    pom.xml <project xmlns="http://maven.apache.org/POM/4.0.0" xml ...

  3. 简述apache,php,mysql三者的关系

    转自:http://blog.csdn.net/w1365966490/article/details/8218959 Apache web 服务器软件.同类产品有微软的 IIS 等.功能是让某台电脑 ...

  4. C#逻辑运算符

    一.C#逻辑运算符 C#语言的逻辑运算符是对变量的值.表达式的运算结果进行比较,基比较结果为True或False. 二.示例 using System;using System.Collections ...

  5. 深入理解React虚拟DOM

    一.什么是虚拟DOM 虚拟DOM可以看做一棵模拟了DOM树的JavaScript对象树.比如: var element = { element: 'ul', props: { id:"uli ...

  6. Shell脚本使用汇总整理——mysql数据库5.7.8以后备份脚本

    Shell脚本使用汇总整理——mysql数据库5.7.8以后备份脚本 Shell脚本使用的基本知识点汇总详情见连接: https://www.cnblogs.com/lsy-blogs/p/92234 ...

  7. Java中的finally

    基础用法: int f1() { try{ return 1; }finally { System.out.println("finall执行"); } } @Test publi ...

  8. setInterval与setTimeout

    在自己用canvas画一个时钟时,画秒钟用的是利用图片将重复的线条遮住,但是会出现有两个秒钟线条同时存在,才想起setInterval有那么个坑,查了点资料,记录下,若有不对的或者未写到的点,还请大家 ...

  9. 12.2 VUE学习之-if判断,实践加减input里的值

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http ...

  10. 面试前赶紧看了5道Python Web面试题,Python面试题No17

    目录 本面试题题库,由公号:非本科程序员 整理发布 第1题: Flask中的请求上下文和应用上下文是什么? 第2题:django中间件的使用? 第3题: django开发中数据做过什么优化? 第4题: ...