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 相关文章推荐
JavaScript 模式之工厂模式(Factory)应用介绍
Nov 15 Javascript
js导入导出excel(实例代码)
Nov 25 Javascript
jQuery移除tr无效的解决方法(tr是动态添加)
Sep 22 Javascript
使用Javascript写的2048小游戏
Nov 25 Javascript
详解Node.js access_token的获取、存储及更新
Jun 20 Javascript
JS判断微信扫码的方法
Aug 07 Javascript
详解JS中的柯里化(currying)
Aug 17 Javascript
JS中精巧的自动柯里化实现方法
Dec 12 Javascript
JS/jQuery实现DIV延时几秒后消失或显示的方法
Feb 12 jQuery
vue.js 中使用(...)运算符报错的解决方法
Aug 09 Javascript
webpack 开发和生产并行设置的方法
Nov 08 Javascript
javascript实现拼图游戏
Jan 29 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 数据库树的遍历方法
2009/02/06 PHP
PHP异常处理浅析
2015/05/12 PHP
用函数式编程技术编写优美的 JavaScript
2006/11/25 Javascript
解决Extjs4中form表单提交后无法进入success函数问题
2013/11/26 Javascript
采用call方式实现js继承
2014/05/20 Javascript
javascript实现根据身份证号读取相关信息
2014/12/17 Javascript
JavaScript中停止执行setInterval和setTimeout事件的方法
2015/05/14 Javascript
jQuery使用zTree插件实现树形菜单和异步加载
2016/02/25 Javascript
jQuery判断浏览器并动态调整select宽度的方法
2016/03/02 Javascript
docker中编译nodejs并使用nginx启动
2017/06/23 NodeJs
vuejs事件中心管理组件间的通信详解
2017/08/09 Javascript
BootStrap table实现表格行拖拽效果
2018/12/01 Javascript
Vue使用localStorage存储数据的方法
2019/05/27 Javascript
JavaScript实现打砖块游戏
2020/02/25 Javascript
vue keep-alive的简单总结
2021/01/25 Vue.js
Python中shutil模块的学习笔记教程
2017/04/04 Python
OpenCV2.3.1+Python2.7.3+Numpy等的配置解析
2018/01/05 Python
在python中只选取列表中某一纵列的方法
2018/11/28 Python
Flask之请求钩子的实现
2018/12/23 Python
python配置文件写入过程详解
2019/10/19 Python
Python大数据之网络爬虫的post请求、get请求区别实例分析
2019/11/16 Python
Python unittest单元测试框架实现参数化
2020/04/29 Python
关于Python错误重试方法总结
2021/01/03 Python
英国骑行、跑步、游泳、铁人三项运动装备专卖店:Wiggle
2016/08/23 全球购物
阿里云:Aliyun.com
2017/02/15 全球购物
爱淘宝:淘宝网购物分享平台
2017/04/28 全球购物
香港中原电器网上商店:Chung Yuen
2019/06/26 全球购物
自我鉴定范文300字
2013/10/01 职场文书
护理职业生涯规划书
2014/01/24 职场文书
乡镇党的群众路线教育实践活动总结报告
2014/10/30 职场文书
现实表现材料范文
2014/12/23 职场文书
小学一年级学生评语大全
2014/12/25 职场文书
幼儿园辞职信范文
2015/02/27 职场文书
年度考核表个人总结
2015/03/06 职场文书
MySQL RC事务隔离的实现
2022/03/31 MySQL
Spring中bean集合注入的方法详解
2022/07/07 Java/Android