jQuery:unbind方法的使用详解


Posted in jQuery onAugust 14, 2017

jQuery:unbind方法的使用详解

一、前言

unbind方法只能解绑用jQuery的bind方法以及用jquery方法注册的事件处理程序。比如:$(‘a').click(function(){})可以通过unbind解绑。用原生addEventListener以及IE下的attachEvent注册的事件以及使用onclick/onmouseover属性绑定的事件不能通过unbind进行解绑。

例如:

以下的事件可以通过unbind解绑:

$('a').click(function(){});
$('a').bind('click',function(){})

以下的事件不可以通过unbind解绑

var a = document.getElementById('a');
a.addEventListener(a,function(){},false);
a.onclick = function(){}

二、使用方式:

传入一个或者多个事件名称字符串,可以解绑该元素上指定的处理事件。

例如:

//解绑所有a上的click事件
  $('a').unbind('click');
  //解绑a上的所有mouseover以及mouseoverout事件
  $('a').unbind('mouseover mouseout');

以上方式比较粗暴,如果在多模块开发中,可能会直接把别的模块注册的处理函数给解绑了。所以可以采用命名空间的方式进行解绑。

例如:

$('a').unbind('click.myspace')
  $('a').unbind('mouseover.myspace,mouseout.myspace)

使用事件处理程序的引用进行解绑。此时第一个参数是事件名称,第二个参数是事件处理函数名称

function handler(){
  alert('hello');
}
$('a').bind('click',handler);
$('a').unbind('click',handler);

传入一个对象给unbind,取消该对象的所有key的名称对应的事件,value是绑定的事件处理函数名称。如下: 

$('a').unbind({
    mouseover: mouseoverHandler,
    mouseout: mouseoutHandler
  });

传入一个jQuery Event对象给unbind,也可以解绑该event对应的处理函数。例如:

$('a').click(function(event){
    if(条件满足){
      $('a').unbind(event);
    }
  });

注意:调用unbind(event)方法就相当于调用unbind(事件类型,事件处理函数名称)

以上就是jQuery:unbind方法的介绍,如有疑问请留言或者到本站社区交流讨论,感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

jQuery 相关文章推荐
详谈jQuery中使用attr(), prop(), val()获取value的异同
Apr 25 jQuery
jQuery操作DOM_动力节点Java学院整理
Jul 04 jQuery
vue单页应用中如何使用jquery的方法示例
Jul 27 jQuery
一个有意思的鼠标点击文字特效jquery代码
Sep 23 jQuery
简单实现jquery隔行变色
Nov 09 jQuery
将jquery.qqFace.js表情转换成微信的字符码
Dec 01 jQuery
jQuery图片查看插件Magnify开发详解
Dec 25 jQuery
使用Ajax和Jquery配合数据库实现下拉框的二级联动的示例
Jan 25 jQuery
jQuery模拟12306城市选择框功能简单实现方法示例
Aug 13 jQuery
jQuery轮播图实例详解
Aug 15 jQuery
jQuery实现的淡入淡出图片轮播效果示例
Aug 29 jQuery
JQuery搜索框自动补全(模糊匹配)功能实现示例
Jan 08 jQuery
jQuery 实时保存页面动态添加的数据的示例
Aug 14 #jQuery
jQuery Ajax 实现分页 kkpager插件实例代码
Aug 10 #jQuery
jquery.uploadView 实现图片预览上传功能
Aug 10 #jQuery
jquery对table做排序操作的实例演示
Aug 10 #jQuery
详解jQuery同步Ajax带来的UI线程阻塞问题及解决办法
Aug 09 #jQuery
快速掌握jquery分页插件jqPaginator的使用方法
Aug 09 #jQuery
jQuery Easyui Treegrid实现显示checkbox功能
Aug 08 #jQuery
You might like
windows下PHP APACHE MYSQ完整配置
2007/01/02 PHP
dedecms防止FCK乱格式化你的代码的修改方法
2007/03/17 PHP
PHP获取浏览器信息类和客户端地理位置的2个方法
2014/04/24 PHP
PHP FATAL ERROR: CALL TO UNDEFINED FUNCTION BCMUL()解决办法
2014/05/04 PHP
php无限极分类递归排序实现方法
2014/11/11 PHP
Symfony的安装和配置方法
2016/03/17 PHP
[原创]php常用字符串输出方法分析(echo,print,printf及sprintf)
2016/07/09 PHP
可以把编码转换成 gb2312编码lib.UTF8toGB2312.js
2007/08/21 Javascript
Javascript学习笔记1 数据类型
2010/01/11 Javascript
js中 关于undefined和null的区别介绍
2013/04/16 Javascript
javascript遍历控件实例详细解析
2014/01/10 Javascript
简介JavaScript中的setDate()方法的使用
2015/06/11 Javascript
基于JavaScript实现一定时间后去执行一个函数
2015/12/14 Javascript
JQuery DIV 动态隐藏和显示的方法
2016/06/23 Javascript
vue 粒子特效的示例代码
2017/09/19 Javascript
详解Vue2 添加对scss的支持
2019/01/02 Javascript
jquery简易手风琴插件的封装
2020/10/13 jQuery
Python多线程编程(四):使用Lock互斥锁
2015/04/05 Python
详解Python中的序列化与反序列化的使用
2015/06/30 Python
Python和JavaScript间代码转换的4个工具
2016/02/22 Python
详解python实现读取邮件数据并下载附件的实例
2017/08/03 Python
python调用tcpdump抓包过滤的方法
2018/07/18 Python
python使用正则筛选信用卡
2019/01/27 Python
基于PyQt4和PySide实现输入对话框效果
2019/02/27 Python
Python基于WordCloud制作词云图
2019/11/29 Python
Python使用uuid库生成唯一标识ID
2020/02/12 Python
Python编程快速上手——Excel到CSV的转换程序案例分析
2020/02/28 Python
Python 中 sorted 如何自定义比较逻辑
2021/02/02 Python
CSS3实现的渐变幻灯片效果
2020/12/07 HTML / CSS
HTML5+CSS3实现拖放(Drag and Drop)示例
2014/07/07 HTML / CSS
C语言如何决定使用那种整数类型
2016/11/26 面试题
公司综合部的成员自我评价分享
2013/11/05 职场文书
合法的离婚协议书范本
2014/10/23 职场文书
2015年普法依法治理工作总结
2015/05/26 职场文书
幼儿园六一主持词开场白
2015/05/28 职场文书
Python的三个重要函数详解
2022/01/18 Python