jquery移除、绑定、触发元素事件使用示例详解


Posted in Javascript onApril 10, 2014
unbind(type [,data])     //data是要移除的函数
$('#btn').unbind("click"); //移除click
$('#btn').unbind(); //移除所有

对于只需要触发一次的,随后就要立即解除绑定的情况,用one()

$('#btn').one("click",function(){.......});

触发操作
trigger() 方法触发被选元素的指定事件类型。

$('#btn').trigger("click");

也可以直接执行事件

$('#btn').click();

触发自定义事件
bind() 方法为被选元素添加一个或多个事件处理程序,并规定事件发生时运行的函数。

$('#btn').bind("myclick",function(){....});

模拟触发上面的绑定函数

$('#btn').trigger("myclick");

传递数据trigger(event,[param1,param2,...])

$('#btn').bind("myclick",function(event,message1,message2){...........});
$('#btn').trigger("myclick",["传给message1","传给message2"]);

触发执行默认操作

$("input").trigger("focus");
//不仅会触发input元素绑定的focus事件,还会触发默认操作——得到焦点

只触发绑定事件,不执行浏览器默认操作

$("input").triggerHandler("focus");
//只触发绑定事件,不执行浏览器默认操作

其他用法

绑定多个事件类型

$("div").bind("mouseover mouseout",function(){.....});

添加事件命名空间

$("div").bind("click.plugin",function(){......});

在所绑定的世界类型后面添加命名空间,这样在删除事件时只需要指定命名空间即可。

$("div").unbind(".plugin");   //删除空间内的事件
$("div").trigger("click!"); //触发所以不包含在命名空间中的click方法

如果包含在命名空间的也要触发

$(“div”).trigger(“click”);

取消或者绑定函数

$('div').bind('click', RecommandProduct);//为div绑定RecommandProduct 函数
$('div').unbind('click', RecommandProduct);//取消RecommandProduct 函数
Javascript 相关文章推荐
学习ExtJS border布局
Oct 08 Javascript
jQuery学习2 选择器的使用说明
Feb 07 Javascript
JavaScript中圆括号()和方括号[]的特殊用法疑问解答
Aug 06 Javascript
jQuery中[attribute!=value]选择器用法实例
Dec 31 Javascript
高性能JavaScript 重排与重绘(2)
Aug 11 Javascript
AngularJs $parse、$eval和$observe、$watch详解
Sep 21 Javascript
基于Javascript倒计时效果
Dec 22 Javascript
JS实现仿百度文库评分功能
Jan 12 Javascript
深入理解React高阶组件
Sep 28 Javascript
JavaScript实现多重继承的方法分析
Jan 09 Javascript
JavaScript设计模式之构造函数模式实例教程
Jul 02 Javascript
微信小程序开发实现的IP地址查询功能示例
Mar 28 Javascript
jquery序列化表单去除指定元素示例代码
Apr 10 #Javascript
jquery删除ID为sNews的tr元素的内容
Apr 10 #Javascript
javascript正则匹配汉字、数字、字母、下划线
Apr 10 #Javascript
jquery禁止输入数字以外的字符的示例(纯数字验证码)
Apr 10 #Javascript
jQuery实现单击按钮遮罩弹出对话框(仿天猫的删除对话框)
Apr 10 #Javascript
jquery获取复选框被选中的值
Apr 10 #Javascript
实现checkbox全选、反选、取消JavaScript小脚本异常
Apr 10 #Javascript
You might like
php mail to 配置详解
2014/01/16 PHP
php阻止页面后退的方法分享
2014/02/17 PHP
PHP+Mysql+jQuery文件下载次数统计实例讲解
2015/10/10 PHP
支付宝服务窗API接口开发php版本
2016/07/20 PHP
thinkPHP5.0框架模块设计详解
2017/03/18 PHP
仿校内登陆框,精美,给那些很厉害但是没有设计天才的程序员
2008/11/24 Javascript
基于jquery的商品展示放大镜
2010/08/07 Javascript
js仿百度贴吧验证码特效实例代码
2014/01/16 Javascript
页面刷新时记住滚动条的位置jquery代码
2014/06/17 Javascript
jQuery设置和获取HTML、文本和值示例
2014/07/08 Javascript
分析了一下JQuery中的extend方法实现原理
2015/02/27 Javascript
javascript中的 object 和 function小结
2016/08/14 Javascript
JS只能输入正整数的简单实例
2016/10/07 Javascript
jQuery得到多个值只能用取Class ,不能用取ID的方法
2016/12/04 Javascript
javascript构造函数以及原型对象的理解
2017/01/13 Javascript
JS批量替换内容中关键词为超链接
2017/02/20 Javascript
原生JS仿QQ阅读点击展开、收起效果
2017/03/08 Javascript
微信小程序开发之选项卡(窗口底部TabBar)页面切换
2017/04/12 Javascript
微信小程序 自定义消息提示框
2017/08/06 Javascript
JS Testing Properties 判断属性是否在对象里的方法
2017/10/01 Javascript
微信小程序修改数组长度的问题的解决
2019/12/17 Javascript
Python3中使用PyMongo的方法详解
2017/07/28 Python
基于python-pptx库中文文档及使用详解
2020/02/14 Python
sqlalchemy实现时间列自动更新教程
2020/09/02 Python
pymongo insert_many 批量插入的实例
2020/12/05 Python
数字漫画:comiXology
2020/06/13 全球购物
公司年终奖分配方案
2014/06/16 职场文书
商业用房租赁协议书
2014/10/13 职场文书
综治维稳工作汇报
2014/10/27 职场文书
2014年保险公司工作总结
2014/11/22 职场文书
百万英镑观后感
2015/06/09 职场文书
2019各种承诺书范文
2019/06/24 职场文书
python爬虫之利用selenium模块自动登录CSDN
2021/04/22 Python
详解Redis瘦身指南
2021/05/26 Redis
html css3不拉伸图片显示效果
2021/06/07 HTML / CSS
详细聊聊Oracle表碎片对性能有多大的影响
2022/03/19 Oracle