主要是最近项目中用到了原生的js 解绑和绑定 事件  然后今天研究了一下,其实问题不大,不过要注意不要把单词写错了,今天我就找了好久单词写错了。

   需求:当鼠标移上去以后,给Select加载元素,接着解除这个事件。贴上代码,这个是可以运行的,兼容 IE FF chrome

  

 <html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>js绑定和解绑事件</title>
</head>
<body>
选择
<select id="sel1">
<option>--请选择--</option>
</select> <br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
选择2
<select id="sel2">
<option>--请选择--</option>
</select> <script type="text/javascript"> var _obj = {}; // 事件绑定
_obj.bindHandler = (function() {
return function(obj,type,fn){
var func = function(){
fn.call(obj); //这里主要是想将obj这个哥们传到我们后期要调用的函数中,所以可以将参数绑定在这个哥们身上
};
obj.fnn = func; //这里主要是为了在解绑的时候取到函数名
obj.addEventListener ? obj.addEventListener(type,func,false) : obj.attachEvent("on"+type,func);
}
})(); // 事件解除
_obj.removeHandler = (function() {
return function(obj,type,fn){
obj.removeEventListener ? obj.removeEventListener(type,fn,false) : obj.detachEvent("on"+type,fn);
}
})(); _obj.selEvent=function(){
var id = this.id;
//添加option
for(var j=0;j<5;j++){
this.options[this.length]=new Option("tl"+j,"值"+j);
} //解除绑定
_obj.removeHandler(this,'mouseover',this.fnn); //如果 id = sel1
if("sel1"==id){
//移除sel2的绑定
var sel2 = document.getElementById('sel2');
_obj.removeHandler(sel2,'mouseover',sel2.fnn);
}
} _obj.init=function(){
//绑定事件
var sels = document.getElementsByTagName("select");
for(var i=0;i<sels.length;i++){
_obj.bindHandler(sels[i],'mouseover',_obj.selEvent);
}
} _obj.init(); </script> </body>
</html>

原生js绑定和解绑事件,兼容IE,FF,chrome的更多相关文章

  1. python 全栈开发,Day55(jQuery的位置信息,JS的事件流的概念(重点),事件对象,jQuery的事件绑定和解绑,事件委托(事件代理))

    一.jQuery的位置信息 jQuery的位置信息跟JS的client系列.offset系列.scroll系列封装好的一些简便api. 一.宽度和高度 获取宽度 .width() 描述:为匹配的元素集 ...

  2. bind,unbing,on,live,delegate绑定和解绑事件

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/T ...

  3. js进阶---12-10、jquery绑定事件和解绑事件是什么

    js进阶---12-10.jquery绑定事件和解绑事件是什么 一.总结 一句话总结:on和off. 1.jquery如何给元素绑定事件? on方法 22 $('#btn1').on('click', ...

  4. python全栈开发day49-jquery的位置信息、事件流、事件对象,事件委托,事件绑定和解绑

    一.昨日内容回顾    1. jQuery的属性操作 1) html属性操作:attr 2) DOM属性操作:prop 3) 类样式操作:addClass.removeClass.toggleClas ...

  5. jquery-10 jquery中的绑定事件和解绑事件的方法是什么

    jquery-10 jquery中的绑定事件和解绑事件的方法是什么 一.总结 一句话总结:bind(); unbind(); one(); 1. jquery中的绑定事件和解绑事件的方法是什么? bi ...

  6. 11-jQuery的事件绑定和解绑

    1.绑定事件 语法: bind(type,data,fn) 描述:为每一个匹配元素的特定事件(像click)绑定一个事件处理器函数. 参数解释: type (String) : 事件类型 data ( ...

  7. 前端 -----jQuery的事件绑定和解绑

    11-jQuery的事件绑定和解绑   1.绑定事件 语法: bind(type,data,fn) 描述:为每一个匹配元素的特定事件(像click)绑定一个事件处理器函数. 参数解释: type (S ...

  8. jQuery绑定和解绑点击事件及重复绑定解决办法

    原文地址:http://www.111cn.net/wy/jquery/47597.htm 绑点击事件这个是jquery一个常用的功能,如click,unbind等等这些事件绑定事情,但还有很多朋友不 ...

  9. jQuery的事件绑定和解绑

    1.绑定事件 $('获取的标签对象').bind('要操作的方法,  {操作的内容  是字典的形式},function(){} ') 语法: bind(type,data,fn) 描述:为每一个匹配元 ...

随机推荐

  1. Python 基础系列一:初识python

    为什么是Python而不是其他语言? C 和 Python.Java.C#等 C语言: 代码编译得到 机器码 ,机器码在处理器上直接执行,每一条指令控制CPU工作. 其他语言: 代码编译得到 字节码 ...

  2. ZOJ-2091-Mean of Subsequence (反证法的运用!!)

    http://blog.csdn.net/u014355480/article/details/40862041 ZOJ2091 题意:其实就是找后几个数的平均值的最大值!! (贪心策略!要找对) k ...

  3. 关于Struts与Ajax整合时的异常处理

     关于Struts与Ajax整合时的异常处理问题: 问题还原: 从而当有异常发出时,会将异常信息发送到页面上.如下图所示:这是一个比较经典的过程: 错误提示页面: 由于sendError()方法里 ...

  4. 使用siege对web接口进行post方式的压力测试

    为了达到压力测试的效果,需要申请一台线上机器,并且安装压力测试的工具siege. 安装新版siege.资料说yum安装的版本2.70对于post方式支持的不好,验证后发现请求可以正常发过去,但是打开d ...

  5. 苹果 AR 新专利马上登陆 Facetime|Facebook 要用 VR 玩直播

    附上VR技术福利视频 链接: https://pan.baidu.com/s/1boGGVs7 密码: viy8 点击关注有更多VR技术资源哦 苹果 AR 新专利马上登陆 Facetime ,使用光场 ...

  6. java基础---java语言概述

    一.计算机编程的两种范型 1.面向过程的模型---具有线性执行特点,认为是代码作用于数据. 2.面向对象的模型---围绕它的数据(即对象)和为这个数据定义的接口来组织程序:实际上是用数据控制代码的访问 ...

  7. win10 uwp 如何让WebView标识win10手机

    本文主要:如何让WebView访问的网页设别为手机,当然这句话我说不好,换个,如何让WebView设别为手机.上面两句话都是错的,因为是服务器识别,不是网页,第二句话应该是让服务器而不是WebView ...

  8. PHP 页面静态化/纯静态化/伪静态化

    个人博客迁移至独立博客:https://blog.plcent.com/,欢迎大家访问 概念 PHP静态化分为:纯静态化 和 伪静态化:纯静态化又分为:局部静态化 和 完全静态化 纯静态化:是把PHP ...

  9. mb_substr函数

    定义和用法 mb_substr() 截取字符串中指定长度字符 注:常用于中文截取,可以避免截取时候出现乱码,即截取半个字符的情况. 类似函数 substr(),iconv_substr() 语法 mb ...

  10. SpringMVC Spring MyBatis整合配置文件

    1.spring管理SqlSessionFactory.mapper 1)在classpath下创建mybatis/sqlMapConfig.xml <?xml version="1. ...