IE FireFox 兼容之 window.event
程序员文章站
2022-03-02 16:53:25
...
先看一段代码:
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<script type="text/javascript">
function testEvent(){
var target = window.event.srcElement ;
document.getElementById('result').innerHTML = target.tagName;
}
</script>
</HEAD>
<BODY>
<div id="result"></div>
<input type="button" value="点我" onclick="javascript:testEvent()"/>
</BODY>
</HTML>
这段代码在IE浏览器下的效果是,点击按钮,页面上显示“input”。但是在FireFox下点击按钮则会报错:window.event is undefined。这是因为在FireFox下window.event只能在事件发生的现场使用,也就是说,event变量必须在方法调用处被传入。再看下面的代码。
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<script type="text/javascript">
function testEvent(number,ev){
var target = ev.srcElement || ev.target;
document.getElementById('result').innerHTML = target.tagName+ number;
}
</script>
</HEAD>
<BODY>
<div id="result"></div>
<input type="button" value="点我" onclick="javascript:testEvent(20,event)"/>
<script type="text/javascript">
//testEvent();
</script>
</BODY>
</HTML>
上面的代码在IE和FireFox下执行都能生效,且效果相同。上面的代码有几处需要注意:
1、传入调用方法的event变量一定要是“event”,其它字符不能代替。但是位置不限。
2、event变量的点击对象获取在IE和firefox下也是不同的。IE下使用 .target获取,FireFoxe则要使用.srcElement获取。
其它兼容性问题
1、IE中 event对象有x,y属性,没有pageX,pageY属性;FireFox中有pageX,pageY属性,没有x,y属性。
2、待续。。。。
推荐阅读
-
JS中使用new Date(str)创建时间对象不兼容firefox和ie的解决方法(两种)
-
JCalendar 日历控件 v1.0 beta[兼容IE&Firefox] 有文档和例子
-
Iframe自适应高度兼容ie,firefox多浏览器
-
JS 组件系列之Bootstrap Table 冻结列功能IE浏览器兼容性问题解决方案
-
[IE&FireFox兼容]JS对select操作
-
使用JavaScript / JQuery导出 html table 数据至 Excel 兼容IE/Chrome/Firefox
-
javascript四个方向无间隙滚动合集(多浏览器IE,firefox兼容)
-
jquery实现图片渐变切换兼容ie6/Chrome/Firefox
-
Javascript的IE和Firefox(火狐)兼容性
-
Javascript的IE和Firefox(火狐)兼容性 css