addEventListener是一个监听事件并处理相应的函数，用于向指定元素添加事件句柄，可使用removeEventListener()方法来移除addEventListener()方法添加的事件句柄。

　　不啰嗦，直接上代码，如：

　　js部分　

　　<script>
　　　　window.onload = function(){
　　　　　　　　var input = document.getElementsByTagName("input")[0];
　　　　　　　　if(input.addEventListener){
　　　　　　　　// 兼容主流浏览器，IE8及以下不支持
　　　　　　　　　　input.addEventListener("click",function(){
　　　　　　　　　　　　　　alert("按钮被点击了！")
　　　　　　　　　　},false) // 指定事件是否在捕获或冒泡阶段执行，false表示冒泡，true表示捕获，默认为冒泡
　　　　　　　　}else if(input.attachEvent){
　　　　　　　　　　// 兼容IE8及以下
　　　　　　　　　　　　input.attachEvent("onclick",function(){
　　　　　　　　　　　　　　alert("按钮被点击了！")
　　　　　　　　　　　　})
　　　　　　　　}
　　　　}
　　</script>

　　body部分：

　　<body>
　　　　<input type="button" value="按钮" />
　　</body>

　　注意：

　　addEventListener()方法，有3个参数。第一个参数是说明监听的事件类型(如：click，注意不要前缀on)，第二个参数是事件执行的函数或方法，第三个参数则指定事件是否在捕获阶段执行，false表示冒泡，true表示捕获，默认为冒泡。该方法对于IE8及以下浏览器不支持。

　　

　　attachEvent()方法，有2个参数。第一个参数是说明监听的事件类型(如：onclick，注意要前缀on)，第二个参数是事件执行的函数或方法。支持IE8及以下版本浏览器

javascript之事件监听的更多相关文章

  1. JavaScript的事件监听、捕获和冒泡

    在前端开发中,我们经常需要对某些事件进行监听.这样只要在指定的元素上触发了该事件,就会执行一个回调函数来进行相关的操作. 而JavaScript中事件监听的方法总共有三种,分别如下: element. ...

  2. javascript的事件监听与捕获和冒泡

    在前端开发中,我们经常需要对某些事件进行监听.这样只要在指定的元素上触发了该事件,就会执行一个回调来进行相关的操作. 而js中事件监听方法总共有三种,分别如下所示: element.addEventL ...

  3. JavaScript addEventListener()事件监听方法

    addEventListener()方法将事件处理程序附加到指定的元素. addEventListener()方法将事件处理程序附加到元素,而不覆盖现有的事件处理程序. 您可以向一个元素添加许多事件处 ...

  4. javascript事件监听与事件委托

      事件监听与事件委托 在js中,常用到element.addEventListener()来进行事件的监听.但是当页面中存在大量需要绑定事件的元素时,这种方式可能会带来性能影响.此时,我们可以用事件 ...

  5. JavaScript事件监听以及addEventListener参数分析

    事件监听 在Javascript中事件的监听是用来对某些操作做出反应的方法.例如监听一个按钮的pressdown, 或者获取鼠标左键按下时候鼠标的位置.这些都需要使用监听来完成.监听的函数很简单:ad ...

  6. Javascript事件监听

    FireFox : addEventListener()方法 IE : attachEvent()方法 为HTML元素添加一个事件监听, 而不是直接对元素的事件属性(如:onclick.onmouse ...

  7. （12）JavaScript之[事件][事件监听]

    事件 /** * 事件: * onload 和 onunload 事件在用户进入或离开页面时被触发 * * onchange事件常结合对输入字段的验证来使用 * onmouseover 和 onmou ...

  8. Javascript事件模型系列（三）jQuery中的事件监听方式及异同点

    作为全球最知名的js框架之一,jQuery的火热程度堪称无与伦比,简单易学的API再加丰富的插件,几乎是每个前端程序员的必修课.从读<锋利的jQuery>开始,到现在使用jQuery有一年 ...

  9. Node.js 教程 05 - EventEmitter(事件监听/发射器 )

    目录: 前言 Node.js事件驱动介绍 Node.js事件 注册并发射自定义Node.js事件 EventEmitter介绍 EventEmitter常用的API error事件 继承EventEm ...

随机推荐

  1. js文件加载优化

    在js引擎部分,我们可以了解到,当渲染引擎解析到script标签时,会将控制权给JS引擎,如果script加载的是外部资源,则需要等待下载完后才能执行. 所以,在这里,我们可以对其进行很多优化工作. ...

  2. 写给小白的JAVA链接MySQL数据库的步骤(JDBC):

    作为复习总结的笔记,我罗列了几个jdbc步骤,后边举个简单的例子,其中的try块请读者自行处理. /* * 1.下载驱动包:com.mysql.jdbc.Driver;网上很多下载资源,自己找度娘,此 ...

  3. DedeCMS V5.7开启memcache缓存的方法配置说明

    一.安装Memcache服务:1.1.linux下的Memcache安装:-------------------------1. 下载 memcache的linux版本,注意 memcached 用 ...

  4. Javascript高级程序设计笔记 <第五章> 引用类型

    一.object类型 创建object实例的方式有两种: //第一种使用new操作符跟构造函数 var person= new Object(); person.name="小王" ...

  5. 自己做一台3D打印机到底有多难？（附教程）

    •    微博: 小样儿老师2015 初识 3D打印技术,即快速成形技术,它是一种以数字模型文件为基础,运用粉末状金属或塑料等可粘合材料,通过逐层打印的方式来构造物体的技术,3D打印机则出现在上世纪9 ...

  6. MySQL安装的三种方式

    .markdown-preview:not([data-use-github-style]) { padding: 2em; font-size: 1.2em; color: rgb(171, 178 ...

  7. Swift3中数组创建方法

    转载自:http://blog.csdn.net/bwf_erg/article/details/70858865 数组是由一组类型相同的元素构成的有序数据集合.数组中的集合元素是有 序的,而且可以重 ...

  8. 基于docker的 Hyperledger Fabric 多机环境搭建（下）

    Docker环境部署见上一篇博客:http://www.cnblogs.com/cnblogs-wangzhipeng/p/6994541.html. 我们部署分布式容器服务后就要在上面部署Fabri ...

  9. ASP.NET Core Web API下事件驱动型架构的实现（二）：事件处理器中对象生命周期的管理

    在上文中,我介绍了事件驱动型架构的一种简单的实现,并演示了一个完整的事件派发.订阅和处理的流程.这种实现太简单了,百十行代码就展示了一个基本工作原理.然而,要将这样的解决方案运用到实际生产环境,还有很 ...

  10. mysql数据库-------基础

    一 数据库是什么 把文件存放于一台机器,然后将多台机器通过网络去访问这台机器上的文件,即共享这台机器上的文件,共享则意味着竞争,会发生数据不安全,需要加锁处理,为了远程访问并处理这台共享机器上的文件, ...