JavaScript 事件监听实例代码[兼容IE,firefox] 含注释- Javascript

当前位置: 首页 > 图文教程 > 网络编程 > Javascript > JavaScript 事件监听实例代码[兼容IE,firefox] 含注释

Javascript: 一段超强的javascript代码解密方法; 感觉很流畅的js实现的键盘控制（带惯性）; 脚本安需导入(装载)的三种模式的对比; 用js实现控制内容的向上向下滚动效果; 非常不错的一个JS分页效果代码，值得研究; 又一个漂亮的导航栏的下拉菜单; 特想搞点新的创意出来-立体方块; 得到当前行的值的javascript代码; 通用的加入收藏夹代码支持IE Firefox等浏览器; javascript状态栏的字符先杂乱出现再排列组合的代码; js之弹出式窗口代码生成器; javascript实现的制作特殊字的脚本; 一个加载js文件的小脚本; 用JavaScript检查大写键（Caps Lock）是否打开的脚本; javascript中的几个运算符; ECMAScript 基础知识; 你需要知道的JavsScript可以做什么？; JavaScript 编程引入命名空间的方法; javascript延时重复执行函数 lLoopRun.js; javascript之函数直接量(function(){})()

No. « ‹ 72 73 74 75 › »

技术文章搜索

关键字

Javascript 中的 JavaScript 事件监听实例代码[兼容IE,firefox] 含注释

出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2009-09-12 浏览: 525 ::

收藏到网摘: n/a

用户注册常用javascript代码 javascript appendChild,innerHTML,join性能比较代码

JavaScript事件监听完整实例含注释，非常的不错，大家可以直接使用。

点击运行可以看到效果:

<!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>

[Ctrl+A 全选提示:你可先修改部分代码,再按运行]

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;
}
};
软晨学习网编辑注：一般情况下是没问题的，但在实际使用中，对于事件对象，需要用
oEventUtil.AddEventHandler(document.getElementById("jb51"),'click',oT);

用户注册常用javascript代码 javascript appendChild,innerHTML,join性能比较代码

Javascript 中的 JavaScript 事件监听实例代码[兼容IE,firefox] 含注释

评论 (0) All