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 相关文章推荐
经常用到的JavasScript事件的翻译
Apr 09 Javascript
文本框回车提交与禁止提交示例
Sep 27 Javascript
jquery $.each 和for怎么跳出循环终止本次循环
Sep 27 Javascript
jquery中的$(document).ready()使用小结
Feb 14 Javascript
Javascript实现颜色rgb与16进制转换的方法
Apr 18 Javascript
jquery判断至少有一个checkbox被选中的方法
Jun 05 Javascript
Javascript 字符串模板的简单实现
Feb 13 Javascript
jQuery 判断是否包含在数组中Array[]的方法
Aug 03 Javascript
jquery 实现回车登录详解及实例代码
Oct 23 Javascript
JS实现自动阅读单词(有道单词本添加功能)
Nov 14 Javascript
浅谈Angular2 ng-content 指令在组件中嵌入内容
Aug 18 Javascript
Vue3 实现双盒子定位Overlay的示例
Dec 22 Vue.js
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 中执行系统外部命令
2006/10/09 PHP
php简单静态页生成过程
2008/03/27 PHP
php实现查看邮件是否已被阅读的方法
2013/12/03 PHP
php递归函数中使用return的注意事项
2014/01/17 PHP
php使用websocket示例详解
2014/03/12 PHP
将二维数组转为一维数组的2种方法
2014/05/26 PHP
php生成动态验证码gif图片
2015/10/19 PHP
php 实现进制相互转换
2016/04/07 PHP
PHP进程通信基础之信号量与共享内存通信
2017/02/19 PHP
goto语法在PHP中的使用教程
2020/09/17 PHP
mouse_on_title.js
2006/08/25 Javascript
用一段js程序来实现动画功能
2007/03/06 Javascript
js截取函数(indexOf,join等)
2010/09/01 Javascript
jQuery语法总结和注意事项小结
2012/11/11 Javascript
自动刷新网页,自动刷新当前页面,JS调用
2013/06/24 Javascript
javascript闭包入门示例
2014/04/30 Javascript
每天一篇javascript学习小结(Array数组)
2015/11/11 Javascript
javascript数据结构之二叉搜索树实现方法
2015/11/25 Javascript
bootstrap输入框组代码分享
2016/06/07 Javascript
js正则表达式验证表单【完整版】
2017/03/06 Javascript
Layui table 组件的使用之初始化加载数据、数据刷新表格、传参数
2017/09/11 Javascript
Vue 项目部署到服务器的问题解决方法
2017/12/05 Javascript
浅谈Python中chr、unichr、ord字符函数之间的对比
2016/06/16 Python
Python numpy.array()生成相同元素数组的示例
2018/11/12 Python
Python matplotlib画曲线例题解析
2020/02/07 Python
纯CSS3打造动感漂亮时尚的扇形菜单
2014/03/18 HTML / CSS
使用html2canvas实现浏览器截图的示例代码
2018/01/26 HTML / CSS
AmazeUI 折叠面板的实现代码
2020/08/17 HTML / CSS
美国男装连锁零售商:Men’s Wearhouse
2016/10/14 全球购物
网上蛋糕店创业计划书
2014/01/24 职场文书
运动会入场词60字
2014/02/15 职场文书
会计与出纳自荐书范文
2014/03/16 职场文书
热爱祖国的演讲稿
2014/05/04 职场文书
员工工作表扬信
2015/05/05 职场文书
python Django框架快速入门教程(后台管理)
2021/07/21 Python
Java spring单点登录系统
2021/09/04 Java/Android