自定义事件 (jQuery)

1jQuery自定义事件之trigger事件

众所周知相似于mousedown、click、keydown等等这类型的事件都是浏览器提供的，通俗叫原生事件，这类型的事件是须要有交互行为才能被触发。

在jQuery经过on方法绑定一个原生事件

$('#elem').on('click', function() {
    alert("触发系统事件")
 });

alert须要执行的条件：必须有用户点击才能够。若是不一样用户交互是否能在某一时刻自动触发该事件呢？ 正常来讲是不能够的，可是jQuery解决了这个问题，提供了一个trigger方法来触发浏览器事件

因此咱们能够这样：

$('#elem').trigger('click');

在绑定on的事件元素上，经过trigger方法就能够调用到alert了，挺简单！

再来看看.trigger是什么？

简单来说就是：根据绑定到匹配元素的给定的事件类型执行全部的处理程序和行为

trigger除了可以触发浏览器事件，同时还支持自定义事件，而且自定义时间还支持传递参数

$('#elem').on('Aaron', function(event,arg1,arg2) {
    alert("自触自定义时间")
 });
$('#elem').trigger('Aaron',['参数1','参数2'])

trigger触发浏览器事件与自定义事件区别？

• 自定义事件对象，是jQuery模拟原生实现的
• 自定义事件能够传递参数

2jQuery自定义事件之triggerHandler事件

trigger事件还有一个特性：会在DOM树上冒泡，因此若是要阻止冒泡就须要在事件处理程序中返回false或调用事件对象中的.stopPropagation() 方法可使事件中止冒泡

trigger事件是具备触发原生与自定义能力的，可是存在一个不可避免的问题： 事件对象event没法完美的实现，毕竟一个是浏览器给的，一个是本身模拟的。尽管 .trigger() 模拟事件对象，可是它并无完美的复制天然发生的事件，若要触发经过 jQuery 绑定的事件处理函数，而不触发原生的事件，使用.triggerHandler() 来代替

triggerHandler与trigger的用法是同样的，重点看不一样之处：

• triggerHandler不会触发浏览器的默认行为，.triggerHandler( "submit" )将不会调用表单上的.submit()
• .trigger() 会影响全部与 jQuery 对象相匹配的元素，而 .triggerHandler() 仅影响第一个匹配到的元素
• 使用 .triggerHandler() 触发的事件，并不会在 DOM 树中向上冒泡。 若是它们不是由目标元素直接触发的，那么它就不会进行任何处理
• 与普通的方法返回 jQuery 对象(这样就可以使用链式用法)相反，.triggerHandler() 返回最后一个处理的事件的返回值。若是没有触发任何事件，会返回 undefined