原生js 通用事件绑定
/*原文地址:http://ejohn.org/blog/flexible-javascript-events/*/
http://blog.csdn.net/qi1271199790/article/details/53458043
/**
* [addEvent &&removeEvent description]
* @param {[obj]} obj [绑定事件的对象]
* @param {str} type [绑定的事件的名称]
* @param {Function} fn [事件触发的回调函数]
*/
var txt=document.getElementById('txt');
function addEvent(obj,type,fn){
if(obj.attachEvent){
obj['e'+type+fn] = fn;
obj[type+fn] = function(){
obj['e'+type+fn](window.event);
};
obj.attachEvent('on'+type,obj[type+fn]);
}else{
obj.addEventListener(type,fn,false);
}
}
function removeEvent(obj,type,fn){
if(obj.detachEvent()){
obj.detachEvent('on'+type,obj[type+fn]);
obj[type+fn] = null;
}else{
obj.removeEventListener(type,fn,false);
}
}
原生js 通用事件绑定的更多相关文章
- JS通用事件监听函数
JS通用事件监听函数 版本一 //把它全部封装到一个对象中 var obj={ readyEvent:function (fn){ if(fn==null){ fn=document; } var o ...
- JS里关于事件的常被考察的知识点:事件流、事件广播、原生JS实现事件代理
1.JS里面的事件流 DOM2级事件模型中规定了事件流的三个阶段:捕获阶段.目标阶段.冒泡阶段,低版本IE(IE8及以下版本)不支持捕获阶段 捕获事件流:Netscape提出的事件流,即事件由页面元素 ...
- 用原生 JS 实现双向绑定及应用实例
写在前面: 所谓的双向绑定,无非是从界面的操作能实时反映到数据,数据的变更也能实时展现到界面.angular封装了双向绑定的方法,使双向绑定变得十分简单.但是在有些场景下(比如下面那个场景),不能使用 ...
- 真正的原生JS数据双向绑定(实时同步)
真正的原生JS数据双向绑定(实时同步) 接触过vue之后我感觉数据双向绑定实在是太好用了,然后就想着到底是什么原理,今天在简书上看到了一位老师的文章 js实现数据双向绑定 然后写出了我自己的代码 wi ...
- JS基础——事件绑定
上一篇博客JS事件对象中,老师问JS事件处理和VB中的事件处理有什么联系?先来解决一下这个问题.举个VB.net中事件处理的样例(JS敲久了,VB习惯的都不熟悉了,看来得常常回想了): 1.事件处理V ...
- JS中事件绑定的三种方式
以下是搜集的在JS中事件绑定的三种方式. 1. HTML onclick attribute <button type="button" id="upl ...
- js中事件绑定要注意的事项之如何在方法中自己打印自己的值
下面是错误的js方法绑定,这样写会造成在方法中不能用 调用方法的dom本身的一些 东西,如各种属性或者jq对象等. <!DOCTYPE html> <html> <hea ...
- JS的事件绑定、事件流模型
.t1 { background-color: #ff8080; width: 1100px; height: 40px } 一.JS事件 (一)JS事件分类 1.鼠标事件:click/dbclick ...
- JS中事件绑定函数,事件捕获,事件冒泡
1 事件绑定:事件与函数绑定以及怎么取消绑定 1.1 元素.onclick这种形式,如下: <div id="div1">aaa</div> <scr ...
随机推荐
- 洛谷 P1447 [NOI2010]能量采集 (莫比乌斯反演)
题意:问题可以转化成求$\sum_{i=1}^{n}\sum_{j=1}^{m}(2*gcd(i,j)-1)$ 将2和-1提出来可以得到:$2*\sum_{i=1}^{n}\sum_{j=1}^{m} ...
- linux驱动开发满三年,回首一下基本看不到其它选择
刚刚搞完一个处理器BSP项目,准备搞下一个自研处理器.说不上来什么喜悦,仅仅有些许茫然.没有刚毕业时对这个行业的痴迷,慢慢认同这仅仅是个谋生工具的想法. 回忆当初编写第一个驱动,就像上了战场.被长官踢 ...
- Effective C++: 02构造、析构、赋值运算
05:了解C++默默编写并调用哪些函数 1:一个空类,如果你自己没声明,编译器就会为它声明(编译器版本的)一个copy构造函数.一个copy assignment操作符和一个析构函数.此外如果你没有声 ...
- OSS跨同城3AZ重磅发布,构造全面数据保护体系
点击订阅新品发布会! 新产品.新版本.新技术.新功能.价格调整,评论在下方,下期更新!关注更多内容,了解更多 最新发布 OSS跨同城3AZ重磅发布 2019年7月3日15时,OSS跨同城3AZ重磅发布 ...
- jquery 即点即改
//在html中建立表单. <table border=""> <th>编号</th> <th>用户名</th> < ...
- 2017 ACM-ICPC 亚洲区(乌鲁木齐赛区)网络赛 H Skiing【拓扑排序,关键路径】
2017 ACM-ICPC 亚洲区(乌鲁木齐赛区)网络赛 H Skiing In this winter holiday, Bob has a plan for skiing at the moun ...
- nodeJs学习-07 express、body-parser;链式操作next
express和body-parser const express=require('express'); const bodyParser=require('body-parser'); var ...
- 4818 Largest Empty Circle on a Segment (几何+二分)
ACM-ICPC Live Archive 挺水的一道题,直接二分圆的半径即可.1y~ 类似于以前半平面交求核的做法,假设半径已经知道,我们只需要求出线段周围哪些位置是不能放置圆心的即可.这样就转换为 ...
- 2018-8-10-win10-uwp-如何在DataTemplate绑定方法
title author date CreateTime categories win10 uwp 如何在DataTemplate绑定方法 lindexi 2018-08-10 19:16:50 +0 ...
- @bzoj - 4377@ [POI2015] Kurs szybkiego czytania
目录 @description@ @solution@ @accepted code@ @details@ @description@ 给定 n, a, b, p,其中 n, a 互质.定义一个长度为 ...