JavaScript DOM 添加事件


Posted in Javascript onFebruary 14, 2009

因为对于支持DOM的浏览器来说,添加事件是用addEventListener()方法来给对象添加事件!
而对于MSIE来说则是用attachEvent()来给对象添加事件!这就使得我们必须用一个容器来装载这两个不同浏览器上对事件的处理方式!这样我们就可以直接调用addEvent()方法来给对象添加事件了!
这不是更方便?!呵呵……
让我们来看看吧!
/**
* 注册一个监听事件到元素
* @param {Object} node 所要添加事件的对象
* @param {Object} type 事件类型
* @param {Object} listener 事件方法
*/
function addEvent( node, type, listener ) {
//使用前面的方法检查兼容性以保证平稳退化
if(!(node = $(node))) return false;

if(node.attachEvent) { // 这是针对IE 的方法
node['e'+type+listener] = listener;
node[type+listener] = function(){node['e'+type+listener]( window.event );}
node.attachEvent( 'on'+type, node[type+listener] );
return true;
}else if (node.addEventListener) {
// 这是针对支持DOM的浏览器的方法
node.addEventListener( type, listener, false );
return true;
}
// 若两种方法都不具备则返回false;
return false;
};
window['liujingning']['addEvent'] = addEvent;

使用方法:
比如我们要给页面的onload()上添加事件,我们就可以这样写:
liujingning.addEvent(window,'load',function(Event) { //这里写你要写的代码}
我们也可以给某个ID添加事件
var getId = document.getElementById('aa');
liujingning.addEvent(getId,'load',function(Event) { //这里写你要写的代码}

Javascript 相关文章推荐
一个JS翻页效果
Jul 23 Javascript
AJAX 网页保留浏览器前进后退等功能
Feb 12 Javascript
JQuery实现用户名无刷新验证的小例子
Mar 22 Javascript
定时器(setTimeout/setInterval)调用带参函数失效解决方法
Mar 26 Javascript
Js base64 加密解密介绍
Oct 11 Javascript
jsp网页搜索结果中实现选中一行使其高亮
Feb 17 Javascript
浅谈JavaScript事件的属性列表
Mar 01 Javascript
jQuery插件实现多级联动菜单效果
Dec 01 Javascript
Bootstrap table使用方法汇总
Nov 17 Javascript
javascript trie前缀树的示例
Jan 29 Javascript
使用Angular CLI快速创建Angular项目的一些基本概念和写法小结
Apr 22 Javascript
js中的reduce()函数讲解
Jan 18 Javascript
CSS+Table图文混排中实现文本自适应图片宽度(超简单+跨所有浏览器)
Feb 14 #Javascript
JavaScript实现动态增加文件域表单
Feb 12 #Javascript
从JavaScript 到 JQuery (1)学习小结
Feb 12 #Javascript
谷歌浏览器 insertCell与appendChild的区别
Feb 12 #Javascript
js 判断 enter 事件
Feb 12 #Javascript
JavaScript 克隆数组最简单的方法
Feb 12 #Javascript
js函数使用技巧之 setTimeout(function(){},0)
Feb 09 #Javascript
You might like
PHP中读取文件的8种方法和代码实例
2014/08/05 PHP
PHP钩子与简单分发方式实例分析
2017/09/04 PHP
PHP7数组的底层实现示例
2019/08/25 PHP
一段好玩的JavaScript代码
2006/12/01 Javascript
js left,right,mid函数
2008/06/10 Javascript
JS随机生成不重复数据的实例方法
2013/07/17 Javascript
使用js的replace()方法查找字符示例代码
2013/10/28 Javascript
javascript操作table(insertRow,deleteRow,insertCell,deleteCell方法详解)
2013/12/16 Javascript
nodejs教程之入门
2014/11/21 NodeJs
JQuery的ON()方法支持的所有事件罗列
2015/02/28 Javascript
javascript常用方法总结
2015/05/14 Javascript
JavaScript中setUTCFullYear()方法的使用简介
2015/06/12 Javascript
jQuery实现垂直半透明手风琴特效代码分享
2015/08/21 Javascript
javascript实现简单加载随机色方块
2015/12/25 Javascript
vue中阻止click事件冒泡,防止触发另一个事件的方法
2018/02/08 Javascript
jQuery实现使用sort方法对json数据排序的方法
2018/04/17 jQuery
javascript实现点击星星小游戏
2019/12/24 Javascript
vue 组件之间事件触发($emit)与event Bus($on)的用法说明
2020/07/28 Javascript
opencv与numpy的图像基本操作
2019/03/08 Python
Python 中包/模块的 `import` 操作代码
2019/04/22 Python
详解python uiautomator2 watcher的使用方法
2019/09/09 Python
Python concurrent.futures模块使用实例
2019/12/24 Python
windows下python安装pip方法详解
2020/02/10 Python
中国最大的团购网站:聚划算
2016/09/21 全球购物
Forever 21美国官网:美国标志性快时尚品牌
2017/02/20 全球购物
Casadei卡萨蒂官网:意大利奢侈鞋履品牌
2017/10/28 全球购物
哈利波特商店:Harry Potter Shop
2018/11/30 全球购物
优衣库台湾官网:UNIQLO台湾
2019/02/01 全球购物
伦敦著名的运动鞋综合商店:Footpatrol
2019/03/25 全球购物
教育学习自我评价
2014/02/03 职场文书
读书活动总结范文
2014/04/26 职场文书
企业年度评优方案
2014/06/02 职场文书
英语自我介绍演讲稿
2014/09/01 职场文书
2014年基层党建工作总结
2014/11/11 职场文书
大学生党员个人总结
2015/02/13 职场文书
详细介绍Java中的CyclicBarrier
2022/04/13 Java/Android