jQuery UI 自动完成：输入完成

Question

使用jQuery autocomplete，是否可以使第一个项目自动突出显示，并在用户点击输入时填充，但当他们退出输入时（输入失去焦点）？

我找到的最接近的是this，但它会在失去焦点时自动完成。

Answer 1

我认为我有一个可行的解决方案 - 不会破坏现有行为 - 通过扩展 $.ui.autocomplete 和覆盖 _suggest 方法。

$.widget('ui.myAutocomplete', $.extend({}, $.ui.autocomplete.prototype, {
    _suggest : function(items) {
        // Call ui.autocomplete's parent method
        $.ui.autocomplete.prototype._suggest.call(this, items);

        // Find the first list item
        var item = this.menu.element.children()[0];

        // Make this item active.
        // An event is expected so a fake one is passed as a parameter.
        this.menu.activate(new jQuery.Event('null.event'), $(item));
    }
}));

您现在可以像使用$.ui.autocomplete 一样使用新的子类$.ui.myAutocomplete

$(function() {
    var source = [
        'test 1'
        ,'test 2'
        ,'test 3'
    ];

    $('#selector')
        .myAutocomplete({
            source : source
        });
});