1、eleObj.addEventListener(eventName,handle,useCapture);

  eleObj:DOM元素;

  eventName:事件名称。注意,这里的事件名称没有“ on ”,如鼠标单击事件 click ,鼠标双击事件 doubleclick ,鼠标移入事件 mouseover,鼠标移出事件 mouseout 等。

  handle:事件句柄函数,即用来处理事件的函数;

  useCapture:Boolean类型,是否使用捕获,一般用false;

2、eleObj.attachEvent(eventName,handle);

  eleObj:DOM元素;

  eventName:事件名称。注意,与addEventListener()不同,这里的事件名称有“ on ”,如鼠标单击事件 onclick ,鼠标双击事件 ondoubleclick ,鼠标移入事件 onmouseover,鼠标移出事件 onmouseout 等;

  handle:事件句柄函数,即用来处理事件的函数;

注意:addEventListener()是标准的绑定事件监听函数的方法,是W3C所支持的,Chrome、FireFox、Opera、Safari、IE9.0及其以上版本都支持该函数;但是,IE8.0及其以下版本不支持该方法,它使用attachEvent()来绑定事件监听函数。所以,这种绑定事件的方法必须要处理浏览器兼容问题。

javascript绑定事件addEventListener与attachEvent的更多相关文章

  1. JavaScript绑定事件的方法[3种]

    在JavaScript中,有三种常用的绑定事件的方法: 在DOM元素中直接绑定: 在JavaScript代码中绑定: 绑定事件监听函数. 一. 在DOM元素中直接绑定 这里的DOM元素,可以理解为HT ...

  2. day51—JavaScript绑定事件

    转换学开发,代码100天——2018-05-06 今天学习JavaScript的绑定事件.因为浏览器的原因绑定事件需要考虑兼容性问题. attachEvent     IE浏览器 ,ie9以上事件执行 ...

  3. javascript绑定事件

    本质:不同的库或者工具中总是封装了不同的事件绑定形式,但是究其根源,还是IE事件模型和W3C事件模型不同的处理方式 1)W3C事件模型:支持事件捕捉和冒泡 addEventListener('type ...

  4. Javascript绑定事件的两种方式的区别

    命名函数 <input type="button" onclick="check()" id="btn"/> <scrip ...

  5. JavaScript 绑定事件时传递数据

    var data = { name: 'Ruchee', email: 'my@ruchee.com' }; data.handleEvent = function (e) { console.log ...

  6. 监听事件绑定(addEventListener、attachEvent)和移除(removeEventListener、detachEvent)

    /** * @description 事件绑定,兼容各浏览器 * @param target 事件触发对象 * @param type 事件 * @param func 事件处理函数 */ funct ...

  7. ie和火狐事件addEventListener()及attachEvent()区别分析

    Mozilla中: addEventListener的使用方式: target.addEventListener(type, listener, useCapture); target: 文档节点.d ...

  8. 绑定事件 addEventListener

    addEventListener() 方法用于向指定元素添加事件句柄. addEventListener() 方法添加的事件句柄不会覆盖已存在的事件句柄. 你可以向一个元素添加多个事件句柄. 你可以向 ...

  9. javaScript绑定事件委托 demo

    事件绑定通常发生在 onload 或 DOMContentReady , 事件绑定占用 处理时间 占用内存, 而且不是每个事件都会被 点击执行. 由此 事件委托 可以优化事件绑定行为.. 事件逐层冒泡 ...

随机推荐

  1. mongo find

    MongoVUE 对应成语句,结构如下: db.logs.find({ "message" : /消息/ }, { "message" : 1 }).limit ...

  2. cron.c

    /* $OpenBSD: cron.c,v 1.39 2007/02/18 23:59:03 jmc Exp $ */ /* Copyright 1988,1990,1993,1994 by Paul ...

  3. ZOJ3770Ranking System 2017-04-14 12:42 52人阅读 评论(0) 收藏

    Ranking System Time Limit: 2 Seconds      Memory Limit: 65536 KB Few weeks ago, a famous software co ...

  4. 23 DesignPatterns学习笔记:C++语言实现 --- 1.2 AbstractFactory

    23 DesignPatterns学习笔记:C++语言实现 --- 1.2 AbstractFactory 2016-07-21 (www.cnblogs.com/icmzn) 模式理解  

  5. [C#]读取指定路径的配置文件[转]

    ExeConfigurationFileMap map = new ExeConfigurationFileMap(); map.ExeConfigFilename = @"C:\App.c ...

  6. [javascript][翻译]使用javascript添加css rule

    来杭一周,收获很多,成长很多. 周六在搞一个插件的时候碰到需要动态添加伪元素的需求,搜了一下解决方案,有人用正则写出了读取伪元素的函数:我觉得倒是可以通过注入css rule的方式,来让预留有某些类的 ...

  7. 使用像素单位设置 EXCEL 列宽或行高

    在导出 Excel 的时候, 经常要需要给列设置宽度或给行设置高度, 在使用 NPOI 或 EppPlus 等组件进行操作的时候, 列宽和行高的单位都不是像素, 好像是英寸,具体是啥也说不清. 平常在 ...

  8. raiserror 的用法

    if exists(select top 1 UserName from [dbo].[LJS_Test_User] where UserName=@UserName) begin raiserror ...

  9. 基于SSH的客户关系管理系统CRM-JavaWeb项目-有源码

    开发工具:Myeclipse/Eclipse + MySQL + Tomcat 项目简介: 项目的编译和运行:1 将数据库导入MysSql里 :打开HeidiSql这个图形化工具,新建一个数据库, 可 ...

  10. java学习笔记—第三方操作数据库包专门接收DataSource-dbutils (30)

    Dbutils 操作数据第三方包.依赖数据源DataSource(DBCP|C3p0). QueryRunner – 接收DataSource|Connection,查询数据删除修改操作.返回结果. ...