`
lwp11411
  • 浏览: 21379 次
  • 性别: Icon_minigender_1
  • 来自: 北京
最近访客 更多访客>>
社区版块
存档分类
最新评论

Javascript 的addEventListener()及attachEvent()区别分析

阅读更多

Mozilla中:

addEventListener的使用方式:

target.addEventListener(type, listener, useCapture);

target: 文档节点、document、window 或 XMLHttpRequest。
type: 字符串,事件名称,不含“on”,比如“click”、“mouseover”、“keydown”等。
listener :实现了 EventListener 接口或者是 JavaScript 中的函数。
useCapture :是否使用捕捉,一般用 false 。例如:document.getElementById("testText").addEventListener("keydown", function (event) { alert(event.keyCode); }, false);

IE中:

target.attachEvent(type, listener);
target: 文档节点、document、window 或 XMLHttpRequest。
type: 字符串,事件名称,含“on”,比如“onclick”、“onmouseover”、“onkeydown”等。
listener :实现了 EventListener 接口或者是 JavaScript 中的函数。 例如:document.getElementById("txt").attachEvent("onclick",function(event){alert(event.keyCode);});

W3C 及 IE 同时支持移除指定的事件, 用途是移除设定的事件, 格式分别如下:

W3C格式:

removeEventListener(event,function,capture/bubble);

Windows IE的格式如下:

detachEvent(event,function);

分享到:
评论

相关推荐

    javascript attachEvent和addEventListener使用方法

    attachEvent与addEventListener区别适应的浏览器版本不同,同时在使用的过程中要注意

    JS在IE和FF下attachEvent,addEventListener学习笔记

    今天小弄了一下JS事件,主要说一下FF和IE兼容的问题

    Javascript处理DOM元素事件实现代码

    但是浏览器有addEventListener和attachEvent方法可供调用,从而模拟出类似于C#中的事件委托的事件触发机制! 代码如下: /* * 功能:事件处理 * Author:LQB * 时间:2009-1-4 * #include JCore.js */ var JEvents = ...

    javascript中的事件代理初探

    javascript提供了addEventListener和attachEvent两个方法来为DOM节点绑定事件,jquery作了进一步封装,提供了兼容各个浏览器的bind方法。现在来看,这种传统的事件绑定方式存在着以下不足: 1.可能需要绑定很多的...

    自己封装的javascript事件队列函数版

    javascript中使用addEventListener()或attachEvent()绑定事件时会有几个小问题: 一、使用addEventListener()或attachEvent()添加的匿名函数无法移除。 代码如下:var oBtn = document.getElementById(‘btn’);oBtn...

    Web程序员必备的7个JavaScript函数

    数年前,只要我们编写JavaScript,都必须用到几个常用的函数,比如,addEventListener 和 attachEvent,并不是为了很超前的技术和功能,只是一些基本的任务,原因是各种浏览器之间的差异造成的。时间过去了这么久,...

    javascript最基本的函数汇总

    我记得早期的 JavaScript ,要完成任何事情几乎都绕不开一些简单的函数,因为浏览器提供商实现功能有所差异,而且不只是边缘功能,基础功能也一样,如 addEventListener 和 attachEvent。虽然时代变了,但仍有一些...

    JavaScript Event学习补遗 addEventSimple

    代码如下: function addEventSimple(obj,evt,fn) { if (obj.addEventListener) obj.addEventListener(evt,fn,false); else if (obj.attachEvent) obj.attachEvent(‘on’+evt,fn); } function removeEventSimple(obj...

    JavaScript 学习笔记 Black.Caffeine 09.11.28

    需要用到addEventListener或者attachEvent,用于吧函数操作添加到事件中去,而不是覆盖,但是,attachEvent不支持FF,FF只能用addEventListener。so,就需要一个函数,把它们俩给综合起来,于是乎,这个函数诞生了:...

    JavaScript事件委托实例分析

    本文实例讲述了JavaScript事件委托用法。分享给大家供大家参考。具体如下: var addEvent = function (elem, eventType, func) { if ( elem.addEventListener ) addEvent = function (elem, eventType, func) { ...

    封装了一个支持匿名函数的Javascript事件监听器

    关于js中的事件监听大家用的比较多了,无非是判断浏览器是否支持addEventListener和attachEvent,网上搜索关于事件监听的方法也挺多,但是总有些不是很完善。下面的方法中对于添加事件监听的方法是一样的,只不过在...

    PHP微信支付接口开发代码

    <script type="text/javascript"> //调用微信JS api 支付 function jsApiCall() { WeixinJSBridge.invoke( "getBrandWCPayRequest", '.$jsApiParameters.', function(res){ //alert(res.err_msg); //...

    利用函数的惰性载入提高javascript代码执行效率

    在 javascript 代码中,因为各浏览器之间的行为的差异,我们经常会在函数中包含了大量的 if 语句,以检查浏览器特性,解决不同浏览器的兼容问题。 例如,我们最常见的为 dom 节点添加事件的函数: 代码如下: ...

    原创-javascript服务器交互型可编辑表格和我的js常用库

    * 自定义javascript常用基础库 author zhang_jhai 创建时间 2010/04/10 最后修改时间 2010/05/03 * version 2.0 */ // Base库基础类 BaseJs = function() { // 判断浏览器类型 userAgent = navigator....

    详解javascript事件绑定使用方法

    由于html是从上至下加载的,通常我们如果在head部分引入...attachEvent(事件名称, 函数),绑定事件处理函数 detachEvent(事件名称, 函数),解除绑定 DOM方式 addEventListener(事件名称,函数, 捕获) removeEventListe

    JavaScriptDesignPatterns:JavaScript设计模式学习

    // 对于支持dom2级事件处理程序 addEventListener方法的浏览器 if (dom.addEventListener) { dom.addEventListener(type, fn, false); } // 对于支持 attachEvent 方法的浏览器 else if (dom.attachEvent) { ...

    讲两件事:1.this指针的用法小探. 2.ie的attachEvent和firefox的addEventListener在事件处理上的区别

    this 指钟是JavaScript语言中的一个特殊指钟,他在代码运行时,指向调用this语句的当前对象. 如果是事件绑定函数,则指向被绑定的元素本身. [removed] //by Go_Rush(阿舜) from ...

Global site tag (gtag.js) - Google Analytics