jquery的trigger和triggerHandler的区别示例介绍


Posted in Javascript onApril 20, 2014

trigger 和triggerHandler都是模拟事件发生的 用具体的案例来描述一下区别

<html lang="en"> 
<head> 
<meta charset="utf-8"> 
<title>test</title> 
<script src="http://code.jquery.com/jquery-1.10.2.js"></script> </head> 
<body> 
<input type="checkbox" /> 
<input type="text" id="test"/> 
<input type="button" value="button" id="bnt" onclick="bntClick()"/> 
</body> 
<script> 
$( document ).ready(function() { 
$("input[type='checkbox']").bind("click",function(){ 
$("#test").val("www.baidu.com"); 
}); 
}); 
function bntClick(){ 
$("input[type='checkbox']").trigger("click"); 
} 
</script> 
</html>

当点击 checkbox的时候 checkbox勾上 并将input[type='text']赋值www.baidu.com

当点击 input[type='button'] 的时候 就会发生跟点击checkbox同样的事情

将trigger换成triggerHandler时候 当点击 input[type='button'] 的时候 就只会给input[type='text']赋值 而不会勾选checkbox

triggerHandler 阻止了 绑定事件的元素的默认行为

Javascript 相关文章推荐
jQuery UI Dialog控件中的表单无法正常提交的解决方法
Dec 19 Javascript
jQuery中mouseover事件用法实例
Dec 26 Javascript
JavaScript实现Java中Map容器的方法
Oct 09 Javascript
jQuery使用方法
Feb 04 Javascript
jQuery实现给input绑定回车事件的方法
Feb 09 Javascript
jquery 校验中国身份证号码实例详解
Apr 11 jQuery
js实现Tab选项卡切换效果
Jul 17 Javascript
JS异步函数队列功能实例分析
Nov 28 Javascript
在vue中读取本地Json文件的方法
Sep 06 Javascript
微信小程序实现多个按钮的颜色状态转换
Feb 15 Javascript
Mpvue中使用Vant Weapp组件库的方法步骤
May 16 Javascript
vue组件 keep-alive 和 transition 使用详解
Oct 11 Javascript
js的参数有长度限制吗?发现不能超过2083个字符
Apr 20 #Javascript
给html超链接设置事件不使用href来完成跳
Apr 20 #Javascript
jQuery响应enter键的实现思路
Apr 18 #Javascript
jquery easyui 结合jsp简单展现table数据示例
Apr 18 #Javascript
jQuery如何取id有.的值一般的方法是取不到的
Apr 18 #Javascript
用jquery仿做发微博功能示例
Apr 18 #Javascript
实例说明为什么不要行内使用javascript
Apr 18 #Javascript
You might like
解析VS2010利用VS.PHP插件调试PHP的方法
2013/07/19 PHP
php出租房数据管理及搜索页面
2017/05/23 PHP
PHP实现的分页类定义与用法示例
2017/07/05 PHP
JavaScript修改css样式style
2008/04/15 Javascript
利用jQuery 实现GridView异步排序、分页的代码
2010/02/06 Javascript
TBCompressor js代码压缩
2011/01/05 Javascript
jquery中常用的SET和GET$(”#msg”).html循环介绍
2013/10/09 Javascript
JS操作CSS随机改变网页背景实现思路
2014/03/10 Javascript
javascript显示中文日期的方法
2015/06/18 Javascript
jQuery焦点图切换特效代码分享
2015/09/15 Javascript
简单谈谈Javascript中类型的判断
2015/10/19 Javascript
jQuery使用Selectator插件实现多选下拉列表过滤框(附源码下载)
2016/04/08 Javascript
JS中的==运算: [''] == false —&gt;true
2016/07/24 Javascript
实例详解Vue项目使用eslint + prettier规范代码风格
2018/08/20 Javascript
elementUI select组件value值注意事项详解
2019/05/29 Javascript
[03:12]2016完美“圣”典风云人物:单车专访
2016/12/02 DOTA
python发送邮件示例(支持中文邮件标题)
2014/02/16 Python
基于Python的身份证号码自动生成程序
2014/08/15 Python
Python实现网站文件的全备份和差异备份
2014/11/30 Python
使用Python编写提取日志中的中文的脚本的方法
2015/04/30 Python
Python 实现简单的电话本功能
2015/08/09 Python
Python3中使用urllib的方法详解(header,代理,超时,认证,异常处理)
2016/09/21 Python
分分钟入门python语言
2018/03/20 Python
python selenium自动上传有赞单号的操作方法
2018/07/05 Python
python中ASCII码字符与int之间的转换方法
2018/07/09 Python
python版本五子棋的实现代码
2018/12/11 Python
pytorch 可视化feature map的示例代码
2019/08/20 Python
python定义类的简单用法
2020/07/24 Python
python不同版本的_new_不同点总结
2020/12/09 Python
python中time tzset()函数实例用法
2021/02/18 Python
荷兰鞋子在线:Nelson Schoenen
2017/12/25 全球购物
最新的大学生找工作自我评价
2013/09/29 职场文书
舌尖上的中国观后感
2015/06/02 职场文书
MySQL子查询中order by不生效问题的解决方法
2021/08/02 MySQL
Python基础 括号()[]{}的详解
2021/11/07 Python
win10蓝屏0xc0000001安全模式进不了怎么办?win10出现0xc0000001的解决方法
2022/08/05 数码科技