为什么在配置的“选择”处理程序之前调用“自动完成选择”处理程序？答案

【问题标题】：Why are "autocompleteselect" handlers called before the configured "select" handler?为什么在配置的“选择”处理程序之前调用“自动完成选择”处理程序？
【发布时间】：2011-04-27 19:02:14
【问题描述】：

我正在构建一个自定义的自动完成小部件，我需要在其中覆盖默认的“选择”行为并让它在任何外部附加的事件处理程序之前运行。

$("#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

我的问题是，为什么？这背后有什么理由吗？在我看来，在给自动完成（）“构造函数”的设置/配置对象中配置的事件处理程序应该首先发生，绑定（）附加的处理程序应该在之后发生。

我意识到我可以在我的插件中使用 bind() 来确保我的事件处理程序是第一个运行的，但是它给代码添加了一些混乱。

【问题讨论】：

“为什么”这样可能只有 jQueryUI 团队成员才能回答...

标签： jquery events jquery-ui autocomplete jquery-ui-autocomplete

【解决方案1】：

这是因为它在后台使用了Widget 对象的_trigger 函数。

查看下面的代码摘录，您会看到在正常事件触发 (this.element.trigger) 之后调用了 callBack（您的 options 参数中的函数）。

_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() );
}

最好的尊重，
斯蒂芬。

【讨论】：