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 delete 属性的使用
Oct 08 Javascript
js下拉菜单语言选项简单实现
Sep 23 Javascript
jquery 图片缩放拖动的简单实例
Jan 08 Javascript
JavaScript操作Cookie详解
Feb 28 Javascript
js兼容火狐显示上传图片预览效果的方法
May 21 Javascript
jQuery选择器用法实例详解
Dec 17 Javascript
JS 组件系列之 bootstrap treegrid 组件封装过程
Apr 28 Javascript
angular使用bootstrap方法手动启动的实例代码
Jul 18 Javascript
微信小程序picker组件简单用法示例【附demo源码下载】
Dec 05 Javascript
vue.js 实现图片本地预览 裁剪 压缩 上传功能
Mar 01 Javascript
小程序ios音频播放没声音问题的解决
Jul 11 Javascript
JS实现数组深拷贝的方法分析
Mar 06 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 搜索框提示(自动完成)实例代码
2012/02/05 PHP
以文件形式缓存php变量的方法
2015/06/26 PHP
Laravel 创建指定表 migrate的例子
2019/10/09 PHP
PHP const定义常量及global定义全局常量实例解析
2020/05/28 PHP
JavaScript与DropDownList 区别分析
2010/01/01 Javascript
Javascript UrlDecode函数代码
2010/01/09 Javascript
说说JSON和JSONP 也许你会豁然开朗
2012/09/02 Javascript
PHP开发者必须掌握的6个关键字
2014/04/14 Javascript
express的中间件cookieParser详解
2014/12/04 Javascript
JavaScript获取指定元素位置的方法
2015/04/08 Javascript
jQuery 3.0 的 setter和getter 模式详解
2016/07/11 Javascript
javascript获取以及设置光标位置
2017/02/16 Javascript
jQuery获取Table某列的值(推荐)
2017/03/03 Javascript
微信小程序图片横向左右滑动案例
2017/05/19 Javascript
Vue shopCart 组件开发详解
2018/01/26 Javascript
vue-quill-editor富文本编辑器简单使用方法
2018/09/21 Javascript
详解基于webpack&gettext的前端多语言方案
2019/01/29 Javascript
vue+iview实现分页及查询功能
2020/11/17 Vue.js
一行JavaScript代码如何实现瀑布流布局
2020/12/11 Javascript
5款Python程序员高频使用开发工具推荐
2019/04/10 Python
Python使用import导入本地脚本及导入模块的技巧总结
2019/08/07 Python
opencv3/C++实现视频读取、视频写入
2019/12/11 Python
PyTorch中的padding(边缘填充)操作方式
2020/01/03 Python
python之随机数函数的实现示例
2020/12/30 Python
Vilebrequin欧洲官网:法国豪华泳装品牌(男士沙滩裤)
2018/04/14 全球购物
struct和class的区别
2015/11/20 面试题
环境科学专业研究生求职信
2013/10/02 职场文书
银行学习十八大感想
2014/01/11 职场文书
个人评价范文分享
2014/01/11 职场文书
优质护理服务演讲稿
2014/05/07 职场文书
2014年护士工作总结范文
2014/11/11 职场文书
优秀共青团员事迹材料
2014/12/25 职场文书
2015年统战工作总结
2015/05/19 职场文书
刑事附带民事起诉状
2015/05/19 职场文书
2016年度先进班组事迹材料
2016/03/01 职场文书
Golang 实现 WebSockets 之创建 WebSockets
2022/04/24 Golang