Question

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

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

那是因为在幕后它使用_trigger对象的Widget函数。

查看下面的代码摘录，您会看到在正常事件触发器（callBack）之后调用this.element.trigger（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() );
}

最好的考虑，
斯特凡。

为什么在配置的“select”处理程序之前调用“autocompleteselect”处理程序？

1 个答案: