jQuery unbind()方法实例详解


Posted in Javascript onJanuary 19, 2016

本文实例讲述了jQuery unbind()方法使用方法。分享给大家供大家参考,具体如下:

jQuery 中的 unbind() 方法是 bind() 方法的反向操作,从每一个匹配的元素中删除绑定的事件。

语法结构:

unbind([type][, data]);

type是事件类型,data为将要移除的事件。具体说明如下:
1、如果没有参数,则删除所有的绑定事件;
2、如果提供了事件类型(type)作为参数,则只删除该类型的绑定事件;
3、如果把在绑定时传递的处理函数作为第2个参数,则只有这个特定的事件处理函数被删除。

请看下面的举例:

<script src="jquery.js" type="text/javascript"></script>
<style>
.info {
  background:#ffff66;
}
</style>
<input type="button" id="btn" value="点击我" />
<input type="button" id="delAll" value="删除全部绑定函数" />
<input type="button" id="delFun2" value="删除第二个绑定函数" /><br />
<div class="info"></div>
<script type="text/javascript">
$(document).ready(function(){
  // 为id为btn的按钮添加绑定事件
  $("#btn").bind('click', fun1=function(){
    $(".info").append('<p>绑定函数1</p>');
  }).bind('click', fun2=function(){
    $(".info").append('<p>绑定函数2</p>');
  }).bind('click', fun3=function(){
    $(".info").append('<p>绑定函数3</p>');
  })
  $("#delAll").bind('click', function(){
    $("#btn").unbind(); //删除全部绑定事件
  })
  $("#delFun2").bind('click', function(){
    $("#btn").unbind('click', fun2); //删除第二个绑定函数
  })
})
</script>

效果展示图:

jQuery unbind()方法实例详解

希望本文所述对大家jQuery程序设计有所帮助。

Javascript 相关文章推荐
浅谈JavaScript编程语言的编码规范
Oct 21 Javascript
jquery实现的图片点击滚动效果
Apr 29 Javascript
jQuery中(function($){})(jQuery)详解
Jul 15 Javascript
JavaScript原生对象常用方法总结(推荐)
May 13 Javascript
如何解决IONIC页面底部被遮住无法向上滚动问题
Sep 06 Javascript
浅谈JQ中mouseover和mouseenter的区别
Sep 13 Javascript
JS正则替换掉小括号及内容的方法
Nov 29 Javascript
微信小程序使用video组件播放视频功能示例【附源码下载】
Dec 08 Javascript
Vue v2.4中新增的$attrs及$listeners属性使用教程
Jan 08 Javascript
js中获取URL参数的共用方法getRequest()方法实例详解
Oct 24 Javascript
JavaScript如何把两个数组对象合并过程解析
Oct 10 Javascript
vue中实现图片压缩 file文件的方法
May 28 Javascript
jQuery绑定事件监听bind和移除事件监听unbind用法实例详解
Jan 19 #Javascript
详解JavaScript对象序列化
Jan 19 #Javascript
学习JavaScript设计模式之单例模式
Jan 19 #Javascript
jQuery中bind(),live(),delegate(),on()绑定事件方法实例详解
Jan 19 #Javascript
学习JavaScript设计模式之装饰者模式
Jan 19 #Javascript
jQuery事件绑定用法详解(附bind和live的区别)
Jan 19 #Javascript
浏览器环境下JavaScript脚本加载与执行探析之动态脚本与Ajax脚本注入
Jan 19 #Javascript
You might like
一些需要禁用的PHP危险函数(disable_functions)
2012/02/23 PHP
深入PHP内存相关的功能特性详解
2013/06/08 PHP
制作安全性高的PHP网站的几个实用要点
2014/12/30 PHP
thinkphp备份数据库的方法分享
2015/01/04 PHP
PHP中ID设置自增后不连续的原因分析及解决办法
2016/08/21 PHP
PHP实现链式操作的三种方法详解
2017/11/16 PHP
PHP code 验证码生成类定义和简单使用示例
2020/05/27 PHP
JavaScript实现Sleep函数的代码
2007/03/04 Javascript
在IE浏览器中resize事件执行多次的解决方法
2011/07/12 Javascript
jQuery中复合属性选择器用法实例
2014/12/31 Javascript
javascript中cookie对象用法实例分析
2015/01/30 Javascript
jQuery动态效果显示人物结构关系图的方法
2015/05/07 Javascript
JavaScript中的parse()方法使用简介
2015/06/12 Javascript
Javascript中的数据类型之旅
2015/10/18 Javascript
浏览器兼容性问题大汇总
2015/12/17 Javascript
JS实现登录页面记住密码和enter键登录方法推荐
2016/05/10 Javascript
JavaScript如何实现图片懒加载(lazyload) 提高用户体验(增强版)
2016/11/30 Javascript
jQuery实现扑克正反面翻牌效果
2017/03/10 Javascript
基于AGS JS开发自定义贴图图层
2017/03/31 Javascript
在angular 6中使用 less 的实例代码
2018/05/13 Javascript
详解webpack的proxyTable无效的解决方案
2018/06/15 Javascript
使用elementUI实现将图片上传到本地的示例
2018/09/04 Javascript
对angularJs中$sce服务安全显示html文本的实例
2018/09/30 Javascript
js前端如何写一个精确的倒计时代码
2019/10/25 Javascript
vue中音频wavesurfer.js的使用方法
2020/02/20 Vue.js
Python中无限元素列表的实现方法
2014/08/18 Python
Python文件打开方式实例详解【a、a+、r+、w+区别】
2019/03/30 Python
使用 Python 快速实现 HTTP 和 FTP 服务器的方法
2019/07/22 Python
Python 堆叠柱状图绘制方法
2019/07/29 Python
pytorch 在sequential中使用view来reshape的例子
2019/08/20 Python
Python for i in range ()用法详解
2020/09/18 Python
使用CSS3编写灰阶滤镜来制作黑白照片效果的方法
2016/05/09 HTML / CSS
HTML5使用Audio标签实现歌词同步的效果
2016/03/17 HTML / CSS
物业项目经理岗位职责
2015/04/01 职场文书
食品质检员岗位职责
2015/04/08 职场文书
工作感言一句话
2015/08/01 职场文书