爲什麼在配置的「select」處理程序之前調用「autocompleteselect」處理程序？

Question

我正在構建一個自定義的自動填充小部件，我需要重寫默認的「選擇」行爲並讓它在任何外部附加的事件處理程序之前運行。

$("#input").autocomplete({ 
    source: ['A','B','C'], 
    select: function() { 
     console.log("from config.select"); 
    } 
}); 
$("#input").bind("autocompleteselect", function(event, ui) { 
    console.log("from bind()"); 
}); 

當我從出現的自動完成的元素，下面被印到我的控制檯：

from bind() 
from config.select 

我的問題是，爲什麼呢？這背後有一些理由嗎？在我看來，在給予autocomplete（）「構造函數」的settings/config對象中配置的事件處理程序應該首先發生，而使用bind（）附加的處理程序應該在之後發生。

我意識到我可以在我的插件中使用bind（）來確保我的事件處理程序是第一次運行，但它爲代碼添加了一些混亂。

Answer 1

這是因爲在幕後它使用Widget對象的_trigger函數。

查看下面的代碼摘錄，您將看到在正常事件觸發器（this.element.trigger）之後調用callBack（選項參數中的函數）。

_trigger: function(type, event, data) { 
    var callback = this.options[ type ]; 

    event = $.Event(event); 
    event.type = (type === this.widgetEventPrefix ? 
     type : 
     this.widgetEventPrefix + type).toLowerCase(); 
    data = data || {}; 

    // copy original event properties over to the new event 
    // this would happen if we could call $.event.fix instead of $.Event 
    // but we don't have a way to force an event to be fixed multiple times 
    if (event.originalEvent) { 
     for (var i = $.event.props.length, prop; i;) { 
      prop = $.event.props[ --i ]; 
      event[ prop ] = event.originalEvent[ prop ]; 
     } 
    } 

    this.element.trigger(event, data); 

    return !($.isFunction(callback) && 
     callback.call(this.element[0], event, data) === false || 
     event.isDefaultPrevented()); 
} 

最佳方面，
斯特凡。