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 相关文章推荐
javascript下4个跨浏览器必备的函数
Mar 07 Javascript
jquery动态改变div宽度和高度
Feb 09 Javascript
js实现同一页面多个不同运动效果的方法
Apr 10 Javascript
JavaScript获取一个范围内日期的方法
Apr 24 Javascript
AngularJS 实现点击按钮获取验证码功能实例代码
Jul 13 Javascript
js实现水平滚动菜单导航
Jul 21 Javascript
JS实现中文汉字按拼音排序的方法
Oct 09 Javascript
解决JQuery全选/反选第二次失效的问题
Oct 11 jQuery
Vue.js组件通信的几种姿势
Oct 23 Javascript
JS Object.preventExtensions(),Object.seal()与Object.freeze()用法实例分析
Aug 25 Javascript
原生JS实现逼真的图片3D旋转效果详解
Feb 16 Javascript
基于elementUI使用v-model实现经纬度输入的vue组件
May 12 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与C#分别格式化文件大小的代码
2011/05/14 PHP
PHP函数学习之PHP函数点评
2012/07/05 PHP
spl_autoload_register与autoload的区别详解
2013/06/03 PHP
PHP cURL初始化和执行方法入门级代码
2015/05/28 PHP
php开发微信支付获取用户地址
2015/10/04 PHP
PHP第三方登录―QQ登录实现方法
2017/02/06 PHP
php查询内存信息操作示例
2019/05/09 PHP
JS实现很实用的对联广告代码(可自适应高度)
2015/09/18 Javascript
深入理解事件冒泡(Bubble)和事件捕捉(capture)
2016/05/28 Javascript
JS清除字符串中重复值的实现方法
2016/08/03 Javascript
JS公共小方法之判断对象是否为domElement的实例
2016/11/25 Javascript
Three.js入门之hello world以及如何绘制线
2017/09/25 Javascript
如何重置vue打印变量的显示方式
2017/12/06 Javascript
vue使用rem实现 移动端屏幕适配
2018/09/26 Javascript
vue缓存的keepalive页面刷新数据的方法
2019/04/23 Javascript
layui radio点击事件实现input显示和隐藏的例子
2019/09/02 Javascript
利用原生JS实现欢乐水果机小游戏
2020/04/23 Javascript
vue组件中实现嵌套子组件案例
2020/08/31 Javascript
在antd Form表单中select设置初始值操作
2020/11/02 Javascript
Vue实现图书管理案例
2021/01/20 Vue.js
[09:34]2018DOTA2国际邀请赛寻真——永不放弃的iG
2018/08/14 DOTA
Python中super()函数简介及用法分享
2016/07/11 Python
python+opencv实现的简单人脸识别代码示例
2017/11/14 Python
python快速建立超简单的web服务器的实现方法
2018/02/17 Python
python验证码识别教程之利用投影法、连通域法分割图片
2018/06/04 Python
python实现简单图片物体标注工具
2019/03/18 Python
jupyter notebook中新建cell的方法与快捷键操作
2020/04/22 Python
亚马逊西班牙购物网站:amazon西班牙
2017/03/06 全球购物
伦敦一家领先的精品零售商:IRIS Fashion
2019/05/24 全球购物
公司离职证明标准格式
2014/11/18 职场文书
网络营销实训总结
2015/08/03 职场文书
技术入股合作协议书
2016/03/21 职场文书
读《推着妈妈去旅行》有感1500字
2019/10/15 职场文书
Django实现聊天机器人
2021/05/31 Python
springboot layui hutool Excel导入的实现
2022/03/31 Java/Android
利用正则表达式匹配浮点型数据
2022/05/30 Java/Android