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 尚未实现错误解决办法
Nov 27 Javascript
JSON 数字排序多字段排序介绍
Sep 18 Javascript
JS下载文件|无刷新下载文件示例代码
Apr 17 Javascript
jQuery结合AJAX之在页面滚动时从服务器加载数据
Jun 30 Javascript
jQuery progressbar通过Ajax请求实现后台进度实时功能
Oct 11 Javascript
Angular4表单验证代码详解
Sep 03 Javascript
VSCode配置react开发环境的步骤
Dec 27 Javascript
swiper移动端轮播插件(触碰图片之后停止轮播)
Dec 28 Javascript
前端axios下载excel文件(二进制)的处理方法
Jul 31 Javascript
vue 中 beforeRouteEnter 死循环的问题
Apr 23 Javascript
JavaScript中作用域链的概念及用途讲解
Aug 06 Javascript
AJAX检测用户名是否存在的方法
Mar 24 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环境――Appserv
2006/12/13 PHP
[原创]效率较高的php下读取文本文件的代码
2008/07/02 PHP
PHP不用第三变量交换2个变量的值的解决方法
2013/06/02 PHP
PHP之sprintf函数用法详解
2014/11/12 PHP
php实现给二维数组中所有一维数组添加值的方法
2017/02/04 PHP
PHP实现的简单留言板功能示例【基于thinkPHP框架】
2018/12/07 PHP
jquery封装的对话框简单实现
2013/07/21 Javascript
js实现用户注册协议倒计时的方法
2015/01/21 Javascript
JavaScript如何自定义trim方法
2015/07/28 Javascript
省市区三级联动下拉框菜单javascript版
2015/08/11 Javascript
浅析JavaScript中的变量复制、参数传递和作用域链
2016/01/13 Javascript
javascript中递归的两种写法
2017/01/17 Javascript
JS控件bootstrap suggest plugin使用方法详解
2017/03/25 Javascript
基于Vue实现timepicker
2017/04/25 Javascript
详解Angular 开发环境搭建
2017/06/22 Javascript
Vue常用指令详解分析
2018/08/19 Javascript
node微信开发之获取access_token+自定义菜单
2019/03/17 Javascript
详解vue中this.$emit()的返回值是什么
2019/04/07 Javascript
JavaScript动态添加数据到表单并提交的几种方式
2019/06/26 Javascript
使用vue-router切换页面时实现设置过渡动画
2019/10/31 Javascript
JavaScript实现指定数量的并发限制的示例代码
2020/03/10 Javascript
详解JavaScript自定义函数
2020/07/29 Javascript
python 实现文件的递归拷贝实现代码
2012/08/02 Python
深入解读Python解析XML的几种方式
2016/02/16 Python
Python访问MongoDB,并且转换成Dataframe的方法
2018/10/15 Python
Java多线程实现四种方式原理详解
2020/06/02 Python
使用css3背景渐变中的透明度来设置不同颜色的背景渐变
2014/03/31 HTML / CSS
LightInTheBox西班牙站点:全球商品在线采购
2016/09/22 全球购物
教师实习的自我鉴定
2013/10/26 职场文书
求职自荐信
2013/12/14 职场文书
公司财务自我评价分享
2013/12/17 职场文书
行政助理工作职责范本
2014/03/04 职场文书
领导干部学习“三严三实”思想汇报
2014/09/15 职场文书
单位介绍信格式范文
2015/05/04 职场文书
甜美蛋糕店的创业计划书模板,拿来即用!
2019/08/21 职场文书
梳理总结Python开发中需要摒弃的18个坏习惯
2022/01/22 Python