ASP.NET| php| javascript ASP| perl| Jsp| vbscript| java| CSS/HTML| C#| C/C++| Python/Ruby| MFC| QT| Delphi/Pascal| Objective-c| Google Go| Shell| Android| IOS| 移动编程| Windows Phone| 综合编程| 正则表达式| 编程技术| 其他语言|

javascript

推荐列表 站点导航

当前位置：首页 > 脚本编程 > javascript >

jquery如何解除事件绑定？

来源:网络整理  作者:  发布时间:2020-12-21 22:41
解除事件绑定的方法：1、使用unbind()和undelegate()方法，分别用于解除由bind()和delegate()方法所绑定的事件；2、使用of...

本教程操作环境：windows7系统、jQuery1.7版，该方法适用于所有品牌电脑。

示例：解除事件绑定

在元素绑定事件之后，当在某个时刻不再需要该事件处理时，可以解除所绑定的事件。在jQuery中提供了unbind()和undelegate()方法，分别用于解除由bind()和delegate()方法所绑定的事件，通过参数指明需要解除的绑定事件即可。当方法没有提供参数时，表示解除该元素所有的事件绑定。

<!doctype html><html> <head> <meta charset="utf-8"> <title>jQuery基本操作事件绑定</title> <script type="text/javascript" src=https://www.ym97.com/"js/jquery-1.7.js"> </script> <style type="text/css"> p{width:200px;height:200px;border:1px solid #666;} #leftp{float:left; margin:0 auto;} #rightp{float:right;} </style> </head> <body> <p id="leftp"> <input type="button" value="bind事件绑定" id="bindBtn"/> <input type="button" value="多事件绑定" id="manyBindBtn"/> <input type="button" value="delegate事件绑定" id="delegateBindBtn"/> <input type="button" value="解除事件绑定" id="removeBindBtn"/> </p> <p id="rightp">右侧展示区</p> <script type="text/javascript"> $(function(){ //使用bind()方法绑定事件 $("#manyBindBtn").bind({ click:function(){$("#rightp").slideToggle();}, mouseover:function(){$("#rightp").css("background-color","red");}, mouseout:function(){$("#rightp").css("background-color","yellow");} }); //使用delegate()方法绑定事件 $(document).delegate("#delegateBindBtn","click",function(){ $("#rightp").slideToggle(); }); //使用hover()方法绑定事件 $("#rightp").hover(function(){ $(this).css("background-color","gray"); },function(){ $(this).css("background-color","white"); }); //使用on()方法绑定事件 $("#leftp").on("click","#bindBtn", function(){ alert("使用bind()方法绑定事件处理"); }); //解除事件绑定 $("#removeBindBtn").on("click",function(){ //1.使用unbind()解除click事件绑定 //$("#manyBindBtn").unbind("click"); //2.使用unbind()解除该元素上的所有事件绑定 //$("#manyBindBtn").unbind(); //3.使用off()方法解除bind()方法的click事件绑定 $("#manyBindBtn").off("click"); //$(document).off("click","#manyBindBtn"); //4.使用off()方法解除该元素上的所有事件绑 //$("#manyBindBtn").off(); //5.使用undelegate()方法解除delegate()方法绑定事件 //$(document).undelegate("#delegateBindBtn","click"); //6.使用off()方法解除delegate()方法绑定事件 $(document).off("click","#delegateBindBtn"); //7.使用off()方法解除on()方法的click事件绑定 $("#leftp").off("click","#bindBtn"); //8.使用off()方法解除所有按钮上的所有事件绑定 $("input[type=button]").off(); }); }); </script> </body></html>

在这里插入图片描述

更多编程相关知识，请访问：编程课程！！

以上就是jquery如何解除事件绑定？的详细内容，更多请关注聚合云库其它相关文章！

解除事件绑定

解除事件绑定的方法：1、使用unbind()和undelegate()方法，分别用于解除由bind()和delegate()方法所绑定的事件；2、使用off()方法，可以解除由on()、bind()和delegate()方法所绑定的事件。

在jQuery1.7+中提供了off()方法，用于解除由on()、bind()和delegate()方法所绑定的事件。off()方法与on完全相同。

jquery如何解除事件绑定？

相关推荐：《jQuery视频教程》

相关热词：

本站内容来源于网络，如有侵权请与我们联系，我们会及时删除，我们深感抱歉！
注：本站所有信息仅供用于网络技术学习参考,学习中请遵循相关法律法规！

本文地址: https://www.juheyunku.com/jiaob/javascript/6819.shtml

上一篇：jquery怎么判断元素是否在
下一篇：react怎么渲染html标签
相关文章
热门TAG
服务器 命令 技巧 详解 调用 标签 功能 织梦 javascript dedecms修改内容 织梦教程 php 白帽 企业网站 外链 权重 MYSQL 网站流量 实例解析 JSP 网站收录 搜索引擎 蜘蛛 windows jquery jquery教程 python tags标签 HTML 织梦cms
最新文章
Javascript是什么？ Javascript是什么？

时间：2021-01-04

Canvas入门实战之实现一个 Canvas入门实战之实现一个

时间：2021-01-04

11月份GitHub上最热门的Ja 11月份GitHub上最热门的Ja

时间：2021-01-04

一篇带给你JavaScript的Cla 一篇带给你JavaScript的Cla

时间：2021-01-04

详解js异步文件加载器 详解js异步文件加载器

时间：2021-01-04

深入理解JavaScript中的箭头 深入理解JavaScript中的箭头

时间：2021-01-04

复盘Node项目中遇到的13+常 复盘Node项目中遇到的13+常

时间：2021-01-04

连续3年稳居第一，全球 连续3年稳居第一，全球

时间：2021-01-04

热门文章
连续3年稳居第一，全球1240万用户，Java 连续3年稳居第一，全球1240万用户，Java

时间：2021-01-04

一篇带给你JavaScript的Class语法介绍 一篇带给你JavaScript的Class语法介绍

时间：2021-01-04

深入理解JavaScript中的箭头函数 深入理解JavaScript中的箭头函数

时间：2021-01-04

Javascript在Chrome浏览器中调试的七个步骤 Javascript在Chrome浏览器中调试的七个步骤

时间：2021-01-04

Canvas入门实战之实现一个图形验证码 Canvas入门实战之实现一个图形验证码

时间：2021-01-04

详解js异步文件加载器 详解js异步文件加载器

时间：2021-01-04

复盘Node项目中遇到的13+常见问题和解决方 复盘Node项目中遇到的13+常见问题和解决方

时间：2021-01-04

11月份GitHub上最热门的JavaScript开源项目 11月份GitHub上最热门的JavaScript开源项目

时间：2021-01-04

Javascript是什么？ Javascript是什么？

时间：2021-01-04

Copyright © www.juheyunku.com      关于 | 合作 | 声明 | 联系 | 更新 | 地图 | Tags

jquery如何解除事件绑定？

2020-12-21　编辑：

本教程操作环境：windows7系统、jQuery1.7版，该方法适用于所有品牌电脑。

示例：解除事件绑定

在元素绑定事件之后，当在某个时刻不再需要该事件处理时，可以解除所绑定的事件。在jQuery中提供了unbind()和undelegate()方法，分别用于解除由bind()和delegate()方法所绑定的事件，通过参数指明需要解除的绑定事件即可。当方法没有提供参数时，表示解除该元素所有的事件绑定。

<!doctype html><html> <head> <meta charset="utf-8"> <title>jQuery基本操作事件绑定</title> <script type="text/javascript" src=https://www.ym97.com/"js/jquery-1.7.js"> </script> <style type="text/css"> p{width:200px;height:200px;border:1px solid #666;} #leftp{float:left; margin:0 auto;} #rightp{float:right;} </style> </head> <body> <p id="leftp"> <input type="button" value="bind事件绑定" id="bindBtn"/> <input type="button" value="多事件绑定" id="manyBindBtn"/> <input type="button" value="delegate事件绑定" id="delegateBindBtn"/> <input type="button" value="解除事件绑定" id="removeBindBtn"/> </p> <p id="rightp">右侧展示区</p> <script type="text/javascript"> $(function(){ //使用bind()方法绑定事件 $("#manyBindBtn").bind({ click:function(){$("#rightp").slideToggle();}, mouseover:function(){$("#rightp").css("background-color","red");}, mouseout:function(){$("#rightp").css("background-color","yellow");} }); //使用delegate()方法绑定事件 $(document).delegate("#delegateBindBtn","click",function(){ $("#rightp").slideToggle(); }); //使用hover()方法绑定事件 $("#rightp").hover(function(){ $(this).css("background-color","gray"); },function(){ $(this).css("background-color","white"); }); //使用on()方法绑定事件 $("#leftp").on("click","#bindBtn", function(){ alert("使用bind()方法绑定事件处理"); }); //解除事件绑定 $("#removeBindBtn").on("click",function(){ //1.使用unbind()解除click事件绑定 //$("#manyBindBtn").unbind("click"); //2.使用unbind()解除该元素上的所有事件绑定 //$("#manyBindBtn").unbind(); //3.使用off()方法解除bind()方法的click事件绑定 $("#manyBindBtn").off("click"); //$(document).off("click","#manyBindBtn"); //4.使用off()方法解除该元素上的所有事件绑 //$("#manyBindBtn").off(); //5.使用undelegate()方法解除delegate()方法绑定事件 //$(document).undelegate("#delegateBindBtn","click"); //6.使用off()方法解除delegate()方法绑定事件 $(document).off("click","#delegateBindBtn"); //7.使用off()方法解除on()方法的click事件绑定 $("#leftp").off("click","#bindBtn"); //8.使用off()方法解除所有按钮上的所有事件绑定 $("input[type=button]").off(); }); }); </script> </body></html>

在这里插入图片描述

更多编程相关知识，请访问：编程课程！！

以上就是jquery如何解除事件绑定？的详细内容，更多请关注聚合云库其它相关文章！

解除事件绑定

解除事件绑定的方法：1、使用unbind()和undelegate()方法，分别用于解除由bind()和delegate()方法所绑定的事件；2、使用off()方法，可以解除由on()、bind()和delegate()方法所绑定的事件。

在jQuery1.7+中提供了off()方法，用于解除由on()、bind()和delegate()方法所绑定的事件。off()方法与on完全相同。

jquery如何解除事件绑定？

相关推荐：《jQuery视频教程》

本站内容来源于网络，如有侵权请与我们联系，我们会及时删除，我们深感抱歉！
注：本站所有信息仅供学习参考！
本文地址为 https://www.juheyunku.com/jiaob/javascript/6819.shtml

相关文章

风云图片

Javascript是什么？

Javascript是什么？

Canvas入门实战之实现一个

Canvas入门实战之实现一个

11月份GitHub上最热门的Ja

11月份GitHub上最热门的Ja

一篇带给你JavaScript的Cla

一篇带给你JavaScript的Cla

详解js异步文件加载器

详解js异步文件加载器

深入理解JavaScript中的箭头

深入理解JavaScript中的箭头

推荐阅读

返回javascript频道首页