jQuery $ el.trigger（’change’）不会触发本机侦听器

请考虑以下HTML：

 o1 o2  

和JavaScript（在文档准备就绪）：

 var $select = $('select'); var select = $select.get(0); function logger(msg) { return function () { console.log(msg); }; } $select.on('change', logger('jquery on select')); $(document).on('change', logger('jquery on document')); select.addEventListener('change', logger('native on select'), false); document.addEventListener('change', logger('native on document'), false); setTimeout(function () { console.log(' == programmatic =='); $select.trigger('change'); console.log(' == now try manual =='); }, 1000); 

这导致控制台中的以下输出：

  == programmatic == jquery on select jquery on document == now try manual == jquery on select native on select jquery on document native on document 

问题是：为什么本地绑定的听众没有被调用？ 怎么叫他们？

这里也是一个jsFiddle： http ： //jsfiddle.net/PVJcf/

（使用jQuery 2.0.2）

Answer 1

本文对该主题进行了很好的概述：

触发事件处理程序

基本上， trigger只会trigger通过jQuery附加的事件处理程序或html中的某些事件处理程序属性。

您可以定义一个插件来触发本机浏览器事件，如下所示：

 (function($) { $.fn.trigger2 = function(eventName) { return this.each(function() { var el = $(this).get(0); triggerNativeEvent(el, eventName); }); }; function triggerNativeEvent(el, eventName){ if (el.fireEvent) { // < IE9 (el.fireEvent('on' + eventName)); } else { var evt = document.createEvent('Events'); evt.initEvent(eventName, true, false); el.dispatchEvent(evt); } } }(jQuery)); // sample usage $('select').trigger2('change'); 

这不是完美的，但应该给你一般的想法。

这是使用此插件的小提琴更新。