event对象的兼容性
最近在调试项目的时候,发现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对象的兼容性的更多相关文章
- event对象和事件冒泡
<!DOCTYPE HTML><html><head> <meta charset="utf-8"> <title>无标 ...
- 前端程序员的蜕变——JS的 event 对象属性、使用实例、兼容性处理(极大提高代码效率、减少代码量)
下面讨论一下 js 中的 Event 对象,主要从以下三个方面详细的描述(点击标题可跳转到对应部分): 1.什么是event 2.怎么用event,用他该注意什么,几个简单实际应用 3.event在不 ...
- dom事件与event对象总结
1 事件:就是文档或浏览器窗口中发生的一些特定的交互瞬间. tips:js和xhtml的交互是通过当用户或浏览器操作网页时发生的事件来处理的. 1.1 事件流:即事件的顺序. 事件 ...
- 火狐和IE的window.event对象详解(转载)
FF的FIREBUG,不仅能测试JS还能检查CSS错误,是一般常用的. 但它主要检查FF方面的错误,对IE就无能为力了. 要测试IE,就用ieTester,它可以测试IE几乎所有版本(1.0恐怕也用不 ...
- vue.js - 奇怪的 event 对象
好久都没有写点东西了, 前段时间工作搞得头大,真的就是一起加班到死了.废话不多说,写这篇文章是因为这次因为 event 对象闹了一个乌龙,以此总结一下. 一.event 对象 (一)事件的 event ...
- Event 对象的属性和方法
事件触发时,会将一个 Event 对象传递给事件处理程序,比如: document.getElementById("testText").addEventListener(&quo ...
- js中的Event对象
event代表事件的状态,例如触发event对象的元素,鼠标的位置及状态,按下的键等等 event对象只在事件发生的过程中才有效. <!DOCTYPE html><html lang ...
- event对象的理解
0.给对象绑定事件准确的说是给对象事件绑定事件函数 1.event:事件对象,当一个事件发生的时候,和当前这个对象发生的事件有关的信息都会被i临时保存到event对象中 2.event对象必须在一个事 ...
- 浏览器中event.srcElement和event.target的兼容性问题
在IE下,event对象有srcElement属性,但是没有target属性:Firefox下,even对象有target属性,但是没有srcElement属性.. 解决方法:使用obj(obj = ...
随机推荐
- css img 等比例自动缩放
按父容器宽度自动缩放,并且保持图片原本的长宽比 img{ width: auto; height: auto; max-width: 100%; max-height: 100%; }
- SqlServer触发器的理解
SqlServer触发器是与表事件相关的特殊存储过程,它的执行不是由程序调用,也不是手工启动,而是由事件来触发.比如当对一个表进行操作( insert,delete, update)时就会激活它执行. ...
- 多GPU设备处理点积示例
多GPU设备处理点积示例,项目打包下载 /* * Copyright 1993-2010 NVIDIA Corporation. All rights reserved. * * NVIDIA Cor ...
- css中如何把鼠标变成手
css中鼠标放上去变成手型怎么设置:其实就是一个属性的问题, css的cursor属性 cursor:pointer; 其实这个属性我也记了很多,到现在都容易拼写错误,不过好在编辑器有提示. defa ...
- Java实现随机出题,10道10以内加减法计算
package com.swift; import java.awt.Toolkit; import java.util.Scanner; public class PlusQuiz { public ...
- 如何使用工具进行C/C++的内存泄漏检测
系统编程中一个重要的方面就是有效地处理与内存相关的问题.你的工作越接近系统,你就需要面对越多的内存问题.有时这些问题非常琐碎,而更多时候它会演变成一个调试内存问题的恶梦.所以,在实践中会用到很多工具来 ...
- 1452: [JSOI2009]Count
Time Limit: 10 Sec Memory Limit: 64 MBSubmit: 3135 Solved: 1828[Submit][Status][Discuss] Descripti ...
- Pots POJ - 3414 (搜索+记录路径)
Pots Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 22688 Accepted: 9626 Special J ...
- >详解<栈
- Eclipse主题更换方法
1.打开Eclipse的Help->Eclipse Marketplace 2.在Find里搜索Eclipse Color Theme,点击Install按钮 3.打开Window->Pr ...