博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
jQuery之事件触发trigger
阅读量:6579 次
发布时间:2019-06-24

本文共 1776 字,大约阅读时间需要 5 分钟。

这个函数也会导致浏览器同名的默认行为的执行。比如,如果用trigger()触发一个'submit',则同样会导致浏览器提交表单。如果要阻止这种默认行为,应返回false。
<script type="text/javascript">
$(function(){
$('#btn').bind("click", function(){
$('#test').append("<p>我的绑定函数1</p>");
}).bind("click", function(){
$('#test').append("<p>我的绑定函数2</p>");
}).bind("click", function(){
$('#test').append("<p>我的绑定函数3</p>");
});
$('#btn').trigger("click");
})
</script>
这里面会自动触发一次click事件。也就是页面加载后,就会自动触发一次。
<script type="text/javascript">
$(function(){
$('#btn').bind("myClick", function(){
$('#test').append("<p>我的自定义事件.</p>");
});
$('#btn').click(function(){
$(this).trigger("myClick");
}).trigger("myClick");
})
</script>
上面的代码是jQuery中的连写方式。也会在页面加载后自动触发一次myClick事件。$('#btn').click(function(){ $(this).trigger("myClick"); }).trigger("myClick");类似于
$('#btn').click(function(){ $(this).trigger("myClick"); });$('#btn').trigger("myClick"); 并列的写法。
trigger()方法还可以传递参数。
<script type="text/javascript">
$(function(){
$('#btn').bind("myClick", function(event, message1, message2){
$('#test').append( "<p>"+message1 + message2 +"</p>");
});
$('#btn').click(function(){
$(this).trigger("myClick",["我的自定义","事件"]);
}).trigger("myClick",["我的自定义","事件"]);
})
</script>

在每一个匹配的元素上触发某类事件。还有一个跟trigger差不多的方法,triggerHandler()。

这个特别的方法将会触发指定的事件类型上所有绑定的处理函数。但不会执行浏览器默认动作,也不会产生事件冒泡。
这个方法的行为表现与trigger类似,但有以下三个主要区别:
* 第一,他不会触发浏览器默认事件。
* 第二,只触发jQuery对象集合中第一个元素的事件处理函数。
* 第三,这个方法的返回的是事件处理函数的返回值,而不是据有可链性的jQuery对象。此外,如果最开始的jQuery对象集合为空,则这个方法返回 undefined 。
<script type="text/javascript">
$(function(){
$('#old').bind("click", function(){
$("input").trigger("focus");
});
$('#new').bind("click", function(){
$("input").triggerHandler("focus");
});
$("input").focus(function(){
$("body").append("<p>focus.</p>");
})
})
</script>
trigger方法还有可能触发input的focus事件。而triggerHandler则不会触发默认事件focus聚焦。

转载地址:http://tnyno.baihongyu.com/

你可能感兴趣的文章
小巧单据打印管理软件
查看>>
JVM原理讲解和调优
查看>>
你为什么一定要去美国?给我一个理由
查看>>
JS -------------------设置弹出框位置屏幕的中间
查看>>
几个内核有关的命令
查看>>
第一章 大网 GNS3 使用
查看>>
性能测试 vbs使用(一)
查看>>
46Exchange 2010升级到Exchange 2013-移除总部CAS2010
查看>>
1.2 linux哲学思想
查看>>
Android机子屏幕适配最简单最全面方案
查看>>
spring拦截器中的事务管理
查看>>
有信网络电话被KC网络电话收购了吗?
查看>>
Java 解析 python使用 pickle序列化后的数据
查看>>
Redis 列表(List)
查看>>
爬虫爬取的网易云热门歌单
查看>>
maxwell的使用--日志增量订阅&消费
查看>>
【示例教程】如何使用LEADTOOLS 的JAVA接口从护照中识别和提取数据
查看>>
关于studio升级 部分报错 查找原因的方法--个人总结
查看>>
Java通信编程 Java Scoket
查看>>
简单对比WDCP与宝塔面板WEB环境区别与选择建议
查看>>