jQuery Custom事件如何正常工作

关于如何实际实现jquery中的自定义事件，我找不到任何好的资源。 就像他们如何模拟事件冒泡等。

Answer 1

这条路：

// bubbling is internal trigger: function( event, data, elem /*, bubbling */ ) { // Event object or event type var type = event.type || event, bubbling = arguments[3]; // Handle a global trigger if ( !elem ) { // Don't bubble custom events when global (to avoid too much overhead) event.stopPropagation(); // Only trigger if we've ever bound an event for it if ( jQuery.event.global[ type ] ) { jQuery.each( jQuery.cache, function() { if ( this.events && this.events[type] ) { jQuery.event.trigger( event, data, this.handle.elem ); } }); } } // ... snip ... // Trigger the event, it is assumed that "handle" is a function var handle = elem.nodeType ? jQuery.data( elem, "handle" ) : (jQuery.data( elem, "__events__" ) || {}).handle; if ( handle ) { handle.apply( elem, data ); } var parent = elem.parentNode || elem.ownerDocument; // ... snip .... if ( !event.isPropagationStopped() && parent ) { jQuery.event.trigger( event, data, parent, true ); } else if ( !event.isDefaultPrevented() ) { // ... snip ... jQuery.event.triggered = true; target[ targetType ](); } } 

这里发生的事情如下：

当调用trigger ，jQuery会检查事件是否被全局触发（ $.trigger("event_name"); ）。

如果它没有被全局触发， 并且传播尚未停止且所讨论的元素具有父元素（ !event.isPropagationStopped() && parent ），则jQuery在父元素上手动调用触发事件。

 jQuery.event.trigger( event, data, parent, true ); 

还有更多的事情 – 请参阅jQuery源代码中的event.js 。

Answer 2

看看教程

 $(document).bind("eventType", ...); // This is equivalent to the plugin's $.subscribe("eventType", ...); $(document).trigger("eventType"); // equivalent to plugin's $.publish("eventType"); 

还要查看这个问题