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加密密码到cookie的实现代码
Apr 18 jQuery
基于jQuery和CSS3实现APPLE TV海报视差效果
Jun 16 jQuery
jQuery绑定事件方法及区别(bind,click,on,live,one)
Aug 14 jQuery
jQuery取得元素标签名称小结(附代码)
Aug 16 jQuery
JavaScript实现离开页面前提示功能【附jQuery实现方法】
Sep 26 jQuery
jQuery实现获取table中鼠标click点击位置行号与列号的方法
Oct 09 jQuery
jQuery实现参数自定义的文字跑马灯效果
Aug 15 jQuery
JS/jQuery实现获取时间的方法及常用类完整示例
Mar 07 jQuery
解决jquery validate 验证不通过后验证正确的信息仍残留在label上的方法
Aug 27 jQuery
jquery实现商品sku多属性选择功能(商品详情页)
Dec 20 jQuery
jQuery 函数实例分析【函数声明、函数表达式、匿名函数等】
May 19 jQuery
jQuery实现计算器功能
Oct 19 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
BBS(php & mysql)完整版(二)
2006/10/09 PHP
Array对象方法参考
2006/10/03 Javascript
运算符&&的三个不同层次
2013/04/07 Javascript
js中继承的几种用法总结(apply,call,prototype)
2013/12/26 Javascript
用Jquery选择器计算table中的某一列某一行的合计
2014/08/13 Javascript
node.js中的console.trace方法使用说明
2014/12/09 Javascript
Bootstrap布局方式详解
2016/05/27 Javascript
深入理解jQuery事件绑定
2016/06/02 Javascript
Asp.Net之JS生成分页条的方法
2016/11/23 Javascript
浅谈jQuery中Ajax事件beforesend及各参数含义
2016/12/03 Javascript
JavaScript使用正则表达式获取全部分组内容的方法示例
2017/01/17 Javascript
vue.js如何更改默认端口号8080为指定端口的方法
2017/07/14 Javascript
JavaScript实现元素滚动条到达一定位置循环追加内容
2017/12/28 Javascript
js动态添加表格逐行添加、删除、遍历取值的实例代码
2018/01/25 Javascript
vue使用jsonp抓取qq音乐数据的方法
2018/06/21 Javascript
Vue2.5学习笔记之如何在项目中使用和配置Vue
2018/09/26 Javascript
微信小程序实现点击图片旋转180度并且弹出下拉列表
2018/11/27 Javascript
微信小程序实用代码段(收藏版)
2019/12/17 Javascript
JS+HTML实现自定义上传图片按钮并显示图片功能的方法分析
2020/02/12 Javascript
原生javascript制作的拼图游戏实现方法详解
2020/02/23 Javascript
解决vue组件销毁之后计时器继续执行的问题
2020/07/21 Javascript
逐行分析鸿蒙系统的 JavaScript 框架(推荐)
2020/09/17 Javascript
[02:58]魔廷新尊——痛苦女王至宝语音台词节选
2020/06/14 DOTA
解决python3在anaconda下安装caffe失败的问题
2017/06/15 Python
python 垃圾收集机制的实例详解
2017/08/20 Python
用不到50行的Python代码构建最小的区块链
2017/11/16 Python
40行Python代码实现天气预报和每日鸡汤推送功能
2020/02/27 Python
Django Serializer HiddenField隐藏字段实例
2020/03/31 Python
澳大利亚领先的优质葡萄酒拍卖会:Langton’s Fine Wines
2019/03/24 全球购物
数控专业毕业生求职信范文
2013/09/21 职场文书
写自荐信要注意什么
2013/12/26 职场文书
关爱残疾人标语
2014/06/25 职场文书
小学阳光体育活动总结
2014/07/05 职场文书
先进个人总结范文
2015/02/15 职场文书
2016年圣诞节义工活动总结
2016/04/01 职场文书
mysql的MVCC多版本并发控制的实现
2021/04/14 MySQL