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 相关文章推荐
jquery 查找新建元素代码
Jul 06 Javascript
自写的一个jQuery圆角插件
Oct 26 Javascript
javascript实现tabs选项卡切换效果(自写原生js)
Mar 19 Javascript
input输入框的自动匹配(原生代码)
Mar 19 Javascript
使用jQuery清空file文件域的解决方案
Apr 12 Javascript
javascript中数组的定义及使用实例
Jan 21 Javascript
js转html实体的方法
Sep 27 Javascript
正则表达式基本语法及表单验证操作详解【基于JS】
Apr 07 Javascript
深入探究AngularJs之$scope对象(作用域)
Jul 20 Javascript
JavaScript实现简单评论功能
Aug 17 Javascript
JavaScript实现简单音乐播放器
Apr 17 Javascript
vue添加锚点,实现滚动页面时锚点添加相应的class操作
Aug 10 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 类商品秒杀计时实现代码
2010/05/05 PHP
PHP下 Mongodb 连接远程数据库的实例代码
2017/08/30 PHP
thinkphp3.2.0 setInc方法 源码全面解析
2018/01/29 PHP
自动检查并替换文本框内的字符
2006/06/30 Javascript
一个不错的用JavaScript实现的UBB编码函数
2007/03/09 Javascript
javascript显示选择目录对话框的代码
2008/11/10 Javascript
jquery 图片预加载 自动等比例缩放插件
2008/12/25 Javascript
点击页面其它地方隐藏该div的两种思路
2013/11/18 Javascript
jQuery中prev()方法用法实例
2015/01/08 Javascript
jquery实现二级导航下拉菜单效果
2015/12/18 Javascript
浅谈js中对象的使用
2016/08/11 Javascript
利用Angularjs和原生JS分别实现动态效果的输入框
2016/09/01 Javascript
JS html时钟制作代码分享
2017/03/03 Javascript
用js屏蔽被http劫持的浮动广告实现方法
2017/08/10 Javascript
vue动态路由配置及路由传参的方式
2018/05/23 Javascript
AngularJS实现动态切换样式的方法分析
2018/06/26 Javascript
详解Vue改变数组中对象的属性不重新渲染View的解决方案
2018/09/21 Javascript
Node.js对MongoDB进行增删改查操作的实例代码
2019/04/18 Javascript
vue 解决异步数据更新问题
2019/10/29 Javascript
Vue路由的模块自动化与统一加载实现
2020/06/05 Javascript
Vue使用axios引起的后台session不同操作
2020/08/14 Javascript
如何在JavaScript中使用localStorage详情
2021/02/04 Javascript
[02:40]DOTA2超级联赛专访430 从小就爱玩对抗性游戏
2013/06/18 DOTA
用python画一只可爱的皮卡丘实例
2019/11/21 Python
Django ForeignKey与数据库的FOREIGN KEY约束详解
2020/05/20 Python
django和flask哪个值得研究学习
2020/07/31 Python
超级英雄、电影和电视、乐队和音乐T恤:Loud Clothing
2019/09/01 全球购物
触发器(trigger)的功能都有哪些?写出一个触发器的例子
2012/09/17 面试题
教师师德教育的自我评价
2013/10/31 职场文书
《青山处处埋忠骨》教学反思
2014/04/22 职场文书
教师业务学习材料
2014/12/16 职场文书
2015年音乐教师个人工作总结
2015/05/20 职场文书
试用期转正工作总结2015
2015/05/28 职场文书
2019年大学生学年自我鉴定!
2019/03/25 职场文书
微信小程序实现聊天室功能
2021/06/14 Javascript
SpringBoot前端后端分离之Nginx服务器下载安装过程
2022/08/14 Servers