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鼠标悬停内容动画切换效果
Apr 27 jQuery
JavaScript自执行函数和jQuery扩展方法详解
Oct 27 jQuery
通过jquery获取上传文件名称、类型和大小的实现代码
Apr 19 jQuery
jQuery.extend 与 jQuery.fn.extend的用法及区别实例分析
Jul 25 jQuery
在Vue项目中引入JQuery-ui插件的讲解
Jan 27 jQuery
JQuery事件委托原理与用法实例分析
May 13 jQuery
JQuery的加载和选择器用法简单示例
May 13 jQuery
高效jQuery选择器的5个技巧实例分析
Nov 26 jQuery
Jquery属性的获取/设置及样式添加/删除操作技巧分析
Dec 23 jQuery
jQuery--遍历操作实例小结【后代、同胞及过滤】
May 22 jQuery
jQuery实现评论模块
Aug 19 jQuery
详解jQuery的核心函数和事件处理
Feb 18 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
PHP获取类中常量,属性,及方法列表的方法
2009/04/09 PHP
php批量添加数据与批量更新数据的实现方法
2014/12/16 PHP
使用PHP连接数据库_实现用户数据的增删改查的整体操作示例
2017/09/01 PHP
php实现微信公众平台发红包功能
2018/06/14 PHP
对laravel的session获取与存取方法详解
2019/10/08 PHP
Swoole扩展的6种模式深入详解
2021/03/04 PHP
javascript第一课
2007/02/27 Javascript
HTML中Select不用Disabled实现ReadOnly的效果
2008/04/07 Javascript
比较简单的异步加载JS文件的代码
2009/07/18 Javascript
js 创建书签小工具之理论
2011/02/25 Javascript
基于jQuery实现下拉收缩(展开与折叠)特效
2012/12/25 Javascript
javascript获取网页中指定节点的父节点、子节点的方法小结
2013/04/24 Javascript
60行js代码实现俄罗斯方块
2015/03/31 Javascript
通过JS判断联网类型和连接状态的实现代码
2015/04/01 Javascript
JS模仿腾讯图片站的图片翻页按钮效果完整实例
2016/06/21 Javascript
JQuery Ajax 异步操作之动态添加节点功能
2017/05/24 jQuery
浅谈JS中的常用选择器及属性、方法的调用
2017/07/28 Javascript
JavaScript实现焦点进入文本框内关闭输入法的核心代码
2017/09/20 Javascript
Echarts实现多条折线可拖拽效果
2019/12/19 Javascript
js实现右键弹出自定义菜单
2020/09/08 Javascript
用python实现面向对像的ASP程序实例
2014/11/10 Python
Python实现Windows和Linux之间互相传输文件(文件夹)的方法
2017/05/08 Python
python里dict变成list实例方法
2019/06/26 Python
python BlockingScheduler定时任务及其他方式的实现
2019/09/19 Python
Python 寻找局部最高点的实现
2019/12/05 Python
浅谈tensorflow使用张量时的一些注意点tf.concat,tf.reshape,tf.stack
2020/06/23 Python
如何用Python徒手写线性回归
2021/01/25 Python
日本运动品牌美津浓官方购物网站:MIZUNO SHOP
2016/08/21 全球购物
中职生自荐信
2013/10/13 职场文书
法律工作求职自荐信
2013/10/31 职场文书
2014年公司迎新年活动方案
2014/02/24 职场文书
大学生创业计划书
2014/08/14 职场文书
红领巾广播站广播稿(3篇)
2014/09/20 职场文书
2015幼儿园庆元旦活动方案
2014/12/09 职场文书
新年晚会开场白
2015/05/29 职场文书
横空出世观后感
2015/06/09 职场文书