<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>JavaScript事件监听完整实例(含注释)</title>
<meta name="generator" content="editplus" />
<meta name="Keywords" content="AddEventHandler,addEventListener,attachEvent,appendChild,getElementsByTagNamem,createElement,createTextNode,IE与FF兼容性,JavaScript事件,JavaScript监听">
<script type="text/javascript">
var oEventUtil = new Object();
oEventUtil.AddEventHandler = function(oTarget,sEventType,fnHandler)
{
//IE和FF的兼容性处理
//如果是FF
if(oTarget.addEventListener){
oTarget.addEventListener(sEventType,fnHandler,false);
}
//如果是IE
else if(oTarget.attachEvent){
oTarget.attachEvent('on'+sEventType,fnHandler);
} else{
oTarget['on'+sEventType] = fnHandler;
}
};
//定义oT事件函数
var oT = function()
{
var oEvent = arguments[0];
var oTarget = oEvent.target || oEvent.srcElement;
alert(oTarget.tagName+'\n'+oTarget.innerHTML+'\n'+oEvent.type);
}
//页面加载时制造36个p,每个p里面显示的文字是Line + i
window.onload = function(){
for(var i = 0;i<36;i++)
{
var oP = document.createElement('p');
var oText = document.createTextNode('Line'+i);
oP.appendChild(oText);
//在文档的第一个div里面添加这些p
document.getElementsByTagName('div')[0].appendChild(oP);
}
//找到所有的p,并添加click的事件监听
var oPList = document.getElementsByTagName('p');
for(var i = 0;i<oPList.length;i++)
{
oEventUtil.AddEventHandler(oPList[i],'click',oT);
}
}
</script>
<style type="text/css">
*
{
margin:0px;
padding:0px;
}
div
{
margin:10px auto;
width:690px;
border:solid 1px #000;
min-height:600px;
padding:20px;
}
div p
{
padding:4px;
margin-left:4px;
margin-top:4px;
border:solid 1px blue;
width:100px;
float:left;
}
pre{
margin:20px 0 0 0;
}
a
{
text-indent:4em;
}
</style>
</head>
<body >
<div>
</div>
</body>
</html>
本文来自: 脚本之家(www.jb51.net) 详细出处参考:http://www.jb51.net/article/19808.htm
addEventListener原来在IE中不可用,在IE中要用attachEvent,
还在想,在FireFox中运行得好好的,怎么到IE下报错了。
处理IE与FireFox事件监听的对象:
var oEventUtil = new Object();
oEventUtil.AddEventHandler = function(oTarget,sEventType,fnHandler)
{
if(oTarget.addEventListener){
oTarget.addEventListener(sEventType,fnHandler,false);
} else if(oTarget.attachEvent){
oTarget.attachEvent('on'+sEventType,fnHandler);
} else{
oTarget['on'+sEventType] = fnHandler;
}
};
分享到:
相关推荐
Javascript的IE和Firefox(火狐)兼容性解决方案
JavaScript在IE和Firefox(火狐)的不兼容问题解决
javascript日历控件 兼容ie firefox opera,很容易放入自己得网页中。简单易用
JavaScript画线,画图兼容FireFox,IE等浏览器
javascript实例代码javascript实例代码
IE和Firefox的鼠标滚轮事件JavaScript代码
javascript实现右键菜单,兼容IE,火狐
JavaScript实现的适合做娱乐频道的焦点图代码,兼容IE和Firefox.zip
Javascript的IE和Firefox兼容性问题集合
javascript实例代码集,共各位朋友参考学习!
Firefox与IE浏览器的javascript兼容性问题Firefox与IE浏览器的javascript兼容性问题Firefox与IE浏览器的javascript兼容性问题Firefox与IE浏览器的javascript兼容性问题Firefox与IE浏览器的javascript兼容性问题Fire...
原生javascript自定义滚动条(兼容IE,火狐,chrom)
解决现有IE和firefox不兼容的问题,内有多种解决方法,请大家好好学习
本文实例讲述了javascript事件监听与事件委托。分享给大家供大家参考,具体如下: 事件监听与事件委托 在js中,常用到element.addEventListener()来进行事件的监听。但是当页面中存在大量需要绑定事件的元素时,这种...
JavaScript 瀑布流 吸顶 兼容IE FF Chrome
javascript的IE和Firefox兼容性汇编 1. document.form.item 问题 (1)现有问题: 现有代码中存在许多 document.formName.item("itemName") 这样的语句,不能在 MF 下运行 (2)解决方法: 改用 document.formName....
javascript option onclick事件ie解决方案 兼容ie,firefox
我们大学老师上个给我们讲的实例 ! HTML实例 网页实例 网页实例代码 HTML实例代码 JAVASCRIPT实例