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 封装 Ajax 常用方法(推荐)
May 21 jQuery
jQuery实现的鼠标滚轮控制图片缩放功能实例
Oct 14 jQuery
javaScript和jQuery自动加载简单代码实现方法
Nov 24 jQuery
vue+jquery+lodash实现滑动时顶部悬浮固定效果
Apr 28 jQuery
jQuery实现下拉菜单动态添加数据点击滑出收起其他功能
Jun 14 jQuery
js jquery 获取某一元素到浏览器顶端的距离实现方法
Sep 05 jQuery
jQuery 同时获取多个标签的指定内容并储存为数组
Nov 20 jQuery
JQuery+Bootstrap 自定义全屏Loading插件的示例demo
Jul 03 jQuery
jquery将json转为数据字典的实例代码
Oct 11 jQuery
jQuery擦除插件eraser使用方法详解
Jan 11 jQuery
jquery+css3实现的经典弹出层效果示例
May 16 jQuery
jQuery实现简单评论区功能
Oct 26 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
上海牌131型七灯四波段四喇叭一级收音机
2021/03/02 无线电
PHP中使用hidef扩展代替define提高性能
2015/04/09 PHP
PHP实现的回溯算法示例
2017/08/15 PHP
最近项目写了一些js,水平有待提高
2009/01/31 Javascript
为指定元素增加样式的js代码
2009/12/09 Javascript
教您去掉ie网页加载进度条的方法
2010/12/09 Javascript
javascript算法学习(直接插入排序)
2011/04/12 Javascript
使用jQuery.wechat构建微信WEB应用
2014/10/09 Javascript
JavaScript中通过prototype属性共享属性和方法的技巧实例
2015/03/13 Javascript
jQuery实现返回顶部效果的方法
2015/05/29 Javascript
JavaScript数据结构链表知识详解
2016/11/21 Javascript
angular+ionic 的app上拉加载更新数据实现方法
2017/01/16 Javascript
webpack入门必知必会
2017/01/16 Javascript
js实现添加删除表格(两种方法)
2017/04/27 Javascript
node.JS md5加密中文与php结果不一致的解决方法
2017/05/05 Javascript
浅谈如何使用 webpack 优化资源
2017/10/20 Javascript
在vue中使用v-bind:class的选项卡方法
2018/09/27 Javascript
javascript的delete运算符知识点总结
2019/11/19 Javascript
python装饰器decorator介绍
2014/11/21 Python
python如何查看系统网络流量的信息
2016/09/12 Python
安装Python和pygame及相应的环境变量配置(图文教程)
2017/06/04 Python
快速了解Python开发中的cookie及简单代码示例
2018/01/17 Python
Python实现K折交叉验证法的方法步骤
2019/07/11 Python
python程序 创建多线程过程详解
2019/09/23 Python
python二分法查找算法实现方法【递归与非递归】
2019/12/06 Python
python super用法及原理详解
2020/01/20 Python
Pycharm常用快捷键总结及配置方法
2020/11/14 Python
全球精选男装和家居用品:Article
2020/04/13 全球购物
小学生家长评语集锦
2014/01/30 职场文书
项目经理聘任书
2014/03/29 职场文书
追讨欠款律师函
2015/06/24 职场文书
食堂卫生管理制度
2015/08/04 职场文书
素质拓展训练感想
2015/08/07 职场文书
导游词之江西赣州
2019/10/15 职场文书
MongoDB使用profile分析慢查询的步骤
2021/04/30 MongoDB
简单聊一聊SQL注入及防止SQL注入
2022/03/23 MySQL