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 相关文章推荐
浅析XMLHttpRequest的缓存问题
Dec 13 Javascript
jquery获得option的值和对option进行操作
Dec 13 Javascript
javascript中CheckBox全选终极方案
May 20 Javascript
在JavaScript的AngularJS库中进行单元测试的方法
Jun 23 Javascript
jQuery中的each()详细介绍(推荐)
May 25 Javascript
一道面试题引发的对javascript类型转换的思考
Mar 06 Javascript
vue分类筛选filter方法简单实例
Mar 30 Javascript
对vue.js中this.$emit的深入理解
Feb 23 Javascript
Vue.js实现双向数据绑定方法(表单自动赋值、表单自动取值)
Aug 27 Javascript
怎么使用javascript深度拷贝一个数组
Jun 06 Javascript
微信小程序实现商城倒计时
Nov 01 Javascript
vue自动化路由的实现代码
Sep 30 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
PHP实现网上点歌(二)
2006/10/09 PHP
php empty函数 使用说明
2009/08/10 PHP
php实现文件下载实例分享
2014/06/02 PHP
Zend Framework入门应用实例详解
2016/12/11 PHP
Yii框架实现记录日志到自定义文件的方法
2017/05/23 PHP
浅谈PHP错误类型及屏蔽方法
2017/05/27 PHP
php+js实现的无刷新下载文件功能示例
2019/08/23 PHP
js捕获鼠标滚轮事件代码
2013/12/16 Javascript
jQuery处理XML文件的几种方法
2016/06/14 Javascript
JS实现获取剪贴板内容的方法
2016/06/21 Javascript
js+canvas实现动态吃豆人效果
2017/03/22 Javascript
angularJS模态框$modal实例代码
2017/05/27 Javascript
微信小程序图片宽100%显示并且不变形
2017/06/21 Javascript
微信小程序之发送短信倒计时功能
2017/08/30 Javascript
js最简单的双向绑定实例讲解
2018/01/02 Javascript
基于jQuery.i18n实现web前端的国际化
2018/05/04 jQuery
Vue单页及多页应用全局配置404页面实践记录
2018/05/22 Javascript
ng-zorro-antd 入门初体验
2018/12/03 Javascript
Vue+element 解决浏览器自动填充记住的账号密码问题
2019/06/11 Javascript
jquery实现吸顶导航效果
2020/01/08 jQuery
Vue 基于 vuedraggable 实现选中、拖拽、排序效果
2020/05/18 Javascript
js实现小球在页面规定的区域运动
2020/06/16 Javascript
利用js实现简易红绿灯
2020/10/15 Javascript
python中cPickle用法例子分享
2014/01/03 Python
python正则表达式之对号入座篇
2018/07/24 Python
Python拼接微信好友头像大图的实现方法
2018/08/01 Python
Python Subprocess模块原理及实例
2019/08/26 Python
Python中zip()函数的简单用法举例
2019/09/02 Python
django-crontab 定时执行任务方法的实现
2019/09/06 Python
Python3实现zip分卷压缩过程解析
2019/10/09 Python
Html5+JS实现手机摇一摇功能
2015/04/24 HTML / CSS
免税水晶:Duty Free Crystal
2019/05/13 全球购物
《守株待兔》教学反思
2014/03/01 职场文书
幼儿园春季开学寄语
2014/04/03 职场文书
党员三严三实对照检查材料
2014/10/13 职场文书
Python批量解压&压缩文件夹的示例代码
2022/04/04 Python