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实现图片平滑滚动详解
Mar 22 jQuery
jQuery实现在HTML文档加载完毕后自动执行某个事件的方法
May 08 jQuery
jquery+ajax实现省市区三级联动 (封装和不封装两种方式)
May 15 jQuery
简单实现jQuery上传图片显示预览功能
Jun 29 jQuery
jquery.rotate.js实现可选抽奖次数和中奖内容的转盘抽奖代码
Aug 23 jQuery
利用JQuery操作iframe父页面、子页面的元素和方法汇总
Sep 10 jQuery
jquery实现左右轮播图效果
Sep 28 jQuery
Vue中正确使用jQuery的方法
Oct 30 jQuery
基于jquery实现五星好评
Nov 18 jQuery
jQuery pagination分页示例详解
Oct 23 jQuery
jQuery pager.js 插件动态分页功能实例分析
Aug 02 jQuery
jQuery实现的移动端图片缩放功能组件示例
May 01 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 将字符串按大写字母分隔成字符串数组
2010/04/30 PHP
PHP Stream_*系列函数
2010/08/01 PHP
php 实现进制转换(二进制、八进制、十六进制)互相转换实现代码
2010/10/22 PHP
深入探讨PHP中的内存管理问题
2011/08/31 PHP
php数组查找函数总结
2014/11/18 PHP
php使用CURL不依赖COOKIEJAR获取COOKIE的方法
2015/06/17 PHP
php实现QQ空间获取当前用户的用户名并生成图片
2015/07/25 PHP
PHP 5.6.11中CURL模块问题的解决方法
2016/08/08 PHP
PHP INT类型在内存中占字节详解
2019/07/20 PHP
php面试实现反射注入的详细方法
2019/09/30 PHP
javascript 函数速查表
2010/02/07 Javascript
Jquery进度条插件 Progress Bar小问题解决
2011/07/12 Javascript
javascript 实现 原路返回
2015/01/21 Javascript
jquery ztree异步搜索(搜叶子)实践
2016/02/25 Javascript
js计算系统当前日期是星期几的方法
2016/07/14 Javascript
Bootstrap源码解读标签、徽章、缩略图和警示框(8)
2016/12/26 Javascript
javascript作用域链与执行环境详解
2017/03/25 Javascript
Vue iview-admin框架二级菜单改为三级菜单的方法
2018/07/03 Javascript
分享5个小技巧让你写出更好的 JavaScript 条件语句
2018/10/20 Javascript
vue.js的vue-cli脚手架中使用百度地图API的实例
2019/01/21 Javascript
微信小程序实现抖音播放效果的实例代码
2020/04/11 Javascript
javascript的hashCode函数实现代码小结
2020/08/11 Javascript
[01:03:18]DOTA2-DPC中国联赛 正赛 RNG vs Dynasty BO3 第一场 1月29日
2021/03/11 DOTA
Python的Django框架中自定义模版标签的示例
2015/07/20 Python
python3+PyQt5实现拖放功能
2018/04/24 Python
关于Pytorch的MLP模块实现方式
2020/01/07 Python
深入浅析Python 命令行模块 Click
2020/03/11 Python
python函数调用,循环,列表复制实例
2020/05/03 Python
使用matplotlib的pyplot模块绘图的实现示例
2020/07/12 Python
JAVA软件工程师测试题
2014/07/25 面试题
中文师范生自荐信
2014/01/30 职场文书
庆中秋节主题活动方案
2014/02/03 职场文书
个人现实表现材料
2014/02/04 职场文书
2019年新郎保证书3篇
2019/10/17 职场文书
mysql幻读详解实例以及解决办法
2022/06/16 MySQL
CSS使用SVG实现动态分布的圆环发散路径动画
2022/12/24 HTML / CSS