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. jmeter 使用ANT运行 设置自动停止时间

    1.直接看图

  2. Leader/Follower多线程网络模型介绍

    之前分享过<轻量级 web server Tornado代码分析>,介绍了目前我们采用nginx + tornado的方式搭建升级.配管.数据中心等各类服务组建客户端迭代体系.最近注意到, ...

  3. Ubuntu的TOOL工具收集

    Ubuntu工具 1. Ubuntu下嵌入式开发环境的搭建 http://www.linuxidc.com/Linux/2011-03/33824.htm

  4. 面试经验之——HE集团,YZ科技

    上周去了HE集团面试,该集团是做车辆辅助驾驶系统的,最终目标瞄准的是自动驾驶,加上再之前在YZ科技的面试经验,有些关于车辆驾驶上的心得想聊聊. 首先说说两个企业的面试情况吧.YZ科技中的两个技术聊天都 ...

  5. 【PAT】1063. Set Similarity (25) 待改进

    Given two sets of integers, the similarity of the sets is defined to be Nc/Nt*100%, where Nc is the ...

  6. Android-隐式意图激活操作系统通话界面

    阅读Android操作系统的 packages/apps/phone/AndroidManifest.xml,是如何暴露的   AndroidManifest.xml Android操作系统在这里明确 ...

  7. 解决IE8不支持console

    解决IE8不支持console,代码中包含console时会报错. //解决 IE8 不支持console window.console = window.console || (function ( ...

  8. sharepoint 2016 download

     链接: http://pan.baidu.com/s/1pLBwvnt 密码: c928 SharePoint 2016 Server中文版,

  9. Android Preferences: How to load the default values when the user hasn't used the preferences-screen?

    在启动 preferences 之前,默认值并不能生效.第一次运行程序时候,默认值没生效,然后获取的 preferences 的值就是错误的. 解决办法是在程序开始时加一行代码使默认值生效. Pref ...

  10. Posix消息队列注意事项

    随内核的持续性 读总是返回最高优先级的最早消息. 当往一个空队列放置一个消息时,允许产生一个信号或启动一个线程. 可认为是一个消息链表 队列中每个消息具有 1.一个无符号整数优先级 2.消息的数据部分 ...