在IE浏览器中添加或删除事件用attachEvent、detachEvent。在其他标准浏览器中则用addEventListener、removeEventListener。下面的对事件的添加和删除做了封装。直接看代码吧!

/**
 * @description 事件绑定,兼容各浏览器
 * @param target
 *            事件触发对象
 * @param type
 *            事件
 * @param func
 *            事件处理函数
 */
function bind(target, type, func) {
	if (target.addEventListener) {// 非ie 和ie9
		target.addEventListener(type, func, false);
	} else if (target.attachEvent) { // ie6到ie8
		target.attachEvent("on" + type, func);
	} else {
		target["on" + type] = func; // ie5
	}
}
/**
 * @description 事件移除,兼容各浏览器
 * @param target
 *            事件触发对象
 * @param type
 *            事件
 * @param func
 *            事件处理函数
 */
function unbind(target, type, func) {
	if (target.removeEventListener) {
		target.removeEventListener(type, func, false);
	} else if (target.detachEvent) {
		target.detachEvent("on" + type, func);
	} else {
		target["on" + type] = null;
	}
}

其他补充关于addEventListener第三个参数的含义,详细请参考https://blog.othree.net/log/2007/02/06/third-argument-of-addeventlistener/这篇文章说的很清楚了。

原生js事件的添加和删除的更多相关文章

  1. 原生js查询、添加、删除类

    1.添加类 为标签添加一个class的类 如:<div id="box" class="box">内容</div> document.g ...

  2. 原生JS事件绑定方法以及jQuery绑定事件方法bind、live、on、delegate的区别

    一.原生JS事件绑定方法: 1.通过HTML属性进行事件处理函数的绑定如: <a href="#" onclick="f()"> 2.通过JavaS ...

  3. 原生js事件和jquery事件的执行顺序问题

    场景:近日,写前端页面时候,在针对输入框input操作时,用到了jquery的插件,插件中使用了jquery的focus()和blur()方法.但是同时,又需要在插件之外再针对输入框的获取焦点和失去焦 ...

  4. 移动终端学习2:触屏原生js事件及重力感应

    如今智能移动设备已经渗透到人们生活的方方面面,用户数量也在不断迅速增长(市场研究机构 eMarketer 在今年初发表的趋势报告中预测,2014年至2018年,中国智能手机用户从总人口的 38.3%增 ...

  5. (三)根据向导创建MFC工程,事件的添加和删除

    一,文档视图结构 文档:它是一个类,这个类专门用来存储数据 视图:它是一个类,这个类专门用来显示和修改数据 框架类:一个容器,这个容器装了视图 健完工程之后,类视图: 运行一下: 几个比较重要的函数 ...

  6. 原生js事件委托(事件代理)方法扩展

    原生js事件委托(事件代理)方法扩展: 通过Node底层原型扩展委托方法 /** * 事件委托方法 * @param eventName {string}:事件名称,如'click' * @param ...

  7. 分别使用原生js和jQuery添加/删除元素的class属性

    一.原生js添加/删除元素的class属性: <!-- span元素原有class = "test" --> <span class="test&quo ...

  8. react.js 之 批量添加与删除功能

    最近做的CMS需要用到批量添加图片的功能:在添加文件的容器盒子内,有两个内容,分别是:添加按钮与被添加的选择文件组件. 结构分析: 被添加的组件,我们称为:UploadQiNiuFiles(七牛文件上 ...

  9. js数值的添加与删除

    js中数组元素的添加和删除 js中数组元素常用添加方法是直接添加.push方法以及unshift方法 删除方法则是delete.pop.shift 集修改方法为一身的则是splice 1.添加: (1 ...

随机推荐

  1. Linux中mongodb安装和导出为json

    采用官方工具导出mongo数据为json格式 文档:https://docs.mongodb.com/manual/reference/program/mongoexport/ 可以远程导出,只要有h ...

  2. [开源ORM] SqliteSugar 3.x .net Core版本成功上线

    SqliteSqlSugar 3.X API 作为支持.NET CORE 为数不多的ORM之一,除了具有优越的性能外,还拥有强大的功能,不只是满足你的增,删,查和改.实质上拥有更多你想像不到的功能,当 ...

  3. SQL Server时间粒度系列----第7节日历数据表详解

    本文目录列表: 1.时间粒度有关描述 2.时间维度有关功能函数3.日历数据表 4.日历数据表数据填充 5.总结语 6.参考清单列表   时间粒度有关描述   将该系列涉及到的时间粒度以及分钟以下的粒度 ...

  4. jQuery实现方式不一样的跳转到底部

    jQuery跳转到页面底部效果 在线体验:http://hovertree.com/texiao/jquery/9.htm 以下是完整HTML代码: <!DOCTYPE html> < ...

  5. [WCF编程]2.SOA概述

    一.SOA简介 1. SOA(面向服务架构)既是一种编程方式,也是软件开发的一种架构方法.根据这种架构方法,应用程序是由具有一定行为(称为服务)的功能单元组成的. 2. SOA的基本思想是构建一个粗粒 ...

  6. 引用js实现checkbox批量选中

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  7. html 空链接 href="#"与href="javascript:void(0)"的区别

    #包含了一个位置信息 默认的锚是#top 也就是网页的上端 而javascript:void(0) 仅仅表示一个死链接 这就是为什么有的时候页面很长浏览链接明明是#但跳动到了页首 而javascrip ...

  8. 【Java每日一题】20161216

    package Dec2016; import java.util.ArrayList; import java.util.List; public class Ques1216 { public s ...

  9. Code First :使用Entity. Framework编程(6) ----转发 收藏

    Chapter6 Controlling Database Location,Creation Process, and Seed Data 第6章 控制数据库位置,创建过程和种子数据 In prev ...

  10. jquery返回顶部,支持手机

    jquery返回顶部,支持手机 效果体验:http://hovertree.com/texiao/mobile/6/ 在pc上我们很容易就可以用scrollTop()来实现流程的向上滚动的返回到顶部的 ...