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实现Select下拉列表进行状态选择功能
Mar 30 jQuery
jQuery+pjax简单示例汇总
Apr 21 jQuery
基于jquery日历价格、库存等设置插件
Jul 05 jQuery
如何将 jQuery 从你的 Bootstrap 项目中移除(取而代之使用Vue.js)
Jul 17 jQuery
jQuery实现切换隐藏与显示同时切换图标功能
Oct 29 jQuery
基于jQuery中ajax的相关方法汇总(必看篇)
Nov 08 jQuery
利用JQUERY实现多个AJAX请求等待的实例
Dec 14 jQuery
jQuery删除/清空指定元素的所有子节点实例代码
Jul 04 jQuery
jquery实现掷骰子小游戏
Oct 24 jQuery
jquery ajax 请求小技巧实例分析
Nov 11 jQuery
JQuery事件委托(适用于给动态生成的脚本元素添加事件)
Feb 01 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
PHP中如何定义和使用常量
2013/02/28 PHP
php获取当前时间的毫秒数的方法
2014/01/26 PHP
神盾加密解密教程(二)PHP 神盾解密
2014/06/08 PHP
UPUPW 更新 64 位 Apache 系列 PHP 7.0 正式版
2015/12/08 PHP
JavaScript入门教程(5) js Screen屏幕对象
2009/01/31 Javascript
js类型检查实现代码
2010/10/29 Javascript
javascript判断office版本示例
2014/04/11 Javascript
浅谈Jquery为元素绑定事件
2015/04/27 Javascript
AngularJS学习笔记之基本指令(init、repeat)
2015/06/16 Javascript
详解javascript跨浏览器事件处理程序
2016/03/27 Javascript
javascript 常用验证函数总结
2016/06/28 Javascript
Javascript(es2016) import和require用法和区别详解
2017/08/11 Javascript
分享5个顶级的JavaScript Ajax组件库
2018/09/16 Javascript
VUE引入第三方js包及调用方法讲解
2019/03/01 Javascript
解决layui的使用以及针对select、radio等表单组件不显示的问题
2019/09/05 Javascript
浅谈vue在html中出现{{}}的原因及解决方式
2020/11/16 Javascript
[01:17:12]职来职往完美电竞专场
2014/09/18 DOTA
[35:27]完美世界DOTA2联赛循环赛 GXR vs FTD BO2第二场 10.29
2020/10/29 DOTA
[01:02:38]DOTA2-DPC中国联赛定级赛 LBZS vs Phoenix BO3第二场 1月10日
2021/03/11 DOTA
Python动态加载模块的3种方法
2014/11/22 Python
Python实现读取目录所有文件的文件名并保存到txt文件代码
2014/11/22 Python
Python实现抓取城市的PM2.5浓度和排名
2015/03/19 Python
浅谈python jieba分词模块的基本用法
2017/11/09 Python
python实现读取excel写入mysql的小工具详解
2017/11/20 Python
Python程序员面试题 你必须提前准备!(答案及解析)
2018/01/23 Python
PyTorch CNN实战之MNIST手写数字识别示例
2018/05/29 Python
利用python生成照片墙的示例代码
2020/04/09 Python
详解解决jupyter不能使用pytorch的问题
2021/02/18 Python
CSS3 text shadow字体阴影效果
2016/01/08 HTML / CSS
Linux中如何用命令创建目录
2016/12/02 面试题
少先队入队活动方案
2014/02/08 职场文书
2014县政府领导班子三严三实对照检查材料思想汇报
2014/09/26 职场文书
师德师风自我剖析材料
2014/09/27 职场文书
教师政风行风评议心得体会
2014/10/21 职场文书
党风廉洁教育心得体会
2016/01/20 职场文书
《秋天的怀念》教学反思
2016/02/17 职场文书