jquery之trigger()

这个函数也会导致浏览器同名的默认行为的执行。比如,如果用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聚焦。

时间: 2024-08-16 19:08:35

jquery之trigger()的相关文章

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

triggerHandler() 方法触发被选元素的指定事件类型.但不会执行浏览器默认动作,也不会产生事件冒泡. triggerHandler() 方法与 trigger() 方法类似.不同的是它不会触发事件(比如表单提交)的默认行为,而且只影响第一个匹配元素. 与 trigger() 方法相比的不同之处 它不会引起事件(比如表单提交)的默认行为 .trigger() 会操作 jQuery 对象匹配的所有元素,而 .triggerHandler() 只影响第一个匹配元素. 由 .triggerH

jQuery中 trigger() 使用心得

trigger() 触发事件 触发事件就是 类似于点击click, mouseover, keydown 等有动作的js事件,简单的说就是一个动作,可能有人会问,那show, hide 是不是? 不是 为什么要用 trigger() ? 比如:你给一个按钮添加了一个click点击事件,弹出提示框,代码如下. var div = $("#mybutton"); //你的按钮. div.click(function() { alert('你是猪啊,~让你点,你就点?');}); 上面的代码

使用jquery的trigger方法优化页面代码

我们做页面级联的时候经常会用到ajax处理数据,会为下拉菜单编写change事件. //城市和区域联动 $("#City").change(function () { var cityValue = $("#City").val(); if (cityValue == -1) { return; } $.ajax({ url: "/BI/GetAreaInfo", type: "GET", data: { Id: cityVa

jQuery事件之:jQuery.event.trigger

现在我们来看看事件机制中的主动触发,我们要分析的是jQuery.event.trigger. 先来看看它在jQ源码中的调用. // 1, 在jQuery.event.simulate中 jQuery.event.simulate = function(){ ... if ( bubble ) { jQuery.event.trigger( e, null, elem ); } ... } // 2, 事件的实例方法中 jQuery.fn.extend({ trigger: function( t

jQuery 事件 - trigger() 方法 和 triggerHandler() 方法

trigger() 方法触发被选元素的指定事件类型. triggerHandler() 方法触发被选元素的指定事件类型.但不会执行浏览器默认动作,也不会产生事件冒泡. triggerHandler() 方法与 trigger() 方法类似.不同的是它不会触发事件(比如表单提交)的默认行为,而且只影响第一个匹配元素. 不同之处: 它不会引起事件(比如表单提交)的默认行为 .trigger() 会操作 jQuery 对象匹配的所有元素,而 .triggerHandler() 只影响第一个匹配元素.

使用jQuery中trigger()方法自动触发事件

一.常用事件 在页面加载完成时  自动触发input的点击事件,在移动端可以实现自动弹出输入法,获得焦点 $("input").trigger("click").focus(); 还有一种简写方式: $("input").click(); 还有其它事件就不一一列出了. 二.自定义事件 $("#btn").on("myClick",function(){ alert("自定义事件"); }

jquery中trigger详解

trigger() 触发事件 触发事件就是 类似于点击click, mouseover, keydown 等有动作的js事件,简单的说就是一个动作,可能有人会问,那show, hide 是不是? 不是 为什么要用 trigger() ? 你用手册 里的索引搜一下click 可以看到 两条 结果 click() 和,click(fn),然后 搜一下trigger 发现只有一个 trigger(type, [data]) .然后你知道我的意思了吧.— trigger 可以传参数进去.我们看看 手册里

Jquery使用trigger()方法模拟事件

一.模拟select $('#selectCount').change(function(){     $('select#some').val(10).change();     //or     $('select#some').val(10).trigger('change'); } 二.模拟点击 $("button:first").click(function () {     update($("span:first")); }); $("but

Jquery 中 .trigger 的用法

项目中有个需求,数据加载完成后,默认模拟点击某个元素节点(选中某个元素节点)并触发事件 $('.course_list dd').on('click', function () {     //取当前节点的某个属性值. var id = $(this).attr('data-id'); //处理其他业务 }); $('.course_list li').on('click', function () {     //取当前节点的某个属性值. var id = $(this).attr('data