ui-autocomplete添加tab键支持

时间:2015-12-17 11:24:31

标签: jquery jquery-ui jquery-autocomplete

我正在尝试向ui-autocomplete添加标签支持(选择第一项)

这里是我的代码,评论是我尝试过的,任何人都有想法我可以这样做tab键会从列表中选择第一项吗?

$.widget("custom.combobox", {
    _create: function() {
        this.wrapper = $( "<span>" )
        .addClass( "custom-combobox" )
        .insertAfter( this.element );

        this.element.hide();
        this._createAutocomplete();
        this._createShowAllButton();

    },

    _createAutocomplete: function() {
        var selected = this.element.children( ":selected" ),
        value = selected.val() ? selected.text() : "";

        this.input = $( "<input>" )
            .appendTo( this.wrapper )
            .val( value )
            .attr( "title", "" )
            .addClass( "input-text custom-combobox-input ui-widget ui-widget-content ui-state-default ui-corner-left" )
            .autocomplete({
                delay: 0,
                minLength: 0,
                source: $.proxy( this, "_source" )
            });

        this._on( this.input, {
            autocompleteselect: function( event, ui ) {
                ui.item.option.selected = true;
                this._trigger( "select", event, {
                    item: ui.item.option
                });
                this.element.trigger('change');
            },
            /* my code */  
            keypress:function(event, ui) {
                if (this.options.tabKey && (event.keyCode || event.which) == 9) {
                    event.preventDefault();
                    this.input.trigger({type: 'keypress', which: 40, keyCode: 40});
                    this.input.trigger({type: 'keypress', which: 13, keyCode: 13});
                }
            },
            /* my code */ 
            autocompletechange: "_removeIfInvalid"
        });
    }
}

0 个答案:

没有答案