如何保持在自动完成中键入的内容

Question

我正在使用Javascript自动完成小部件，它在我键入时正确地显示建议列表，但是当我按下键浏览列表时，我的当前输入将被删除。

​

SERVIÇO OU PRODUTO是一个占位符。

虽然这不是我的问题，但是这个小提琴应该演示这个问题。在键入一个字母并按下键后，它将我的输入替换为所选内容。

这是我的密码：

$.widget('custom.mcautocomplete', $.ui.autocomplete, {
    _create: function() {
        this._super();
    },
    _renderItem: function(ul, item) {
        var t = '',
            result = '';

        $.each(this.options.columns, function() {
            t = '<span>' + item[0] + ' - R$ ' + item[1] + '</span>';
        });

        result = $('<li></li>')
            .data(item)
            .append(t)
            .appendTo(ul);
        return result;
    }
});

$("#my-input").mcautocomplete({
    columns: my-columns,
    source: my-info,
    select: function(event, ui) {
        this.value = (ui.item[0]);
        return false;
    }
});

Answer 1

必须取消焦点事件：

focus: function(event, ui) {
    event.preventDefault();
}

手摇琴工作演示

您提供的小提琴确实取消了事件，但通过以下操作立即取消了自己的操作：

$("#customer-search").val(ui.item.label);

请参阅自动完成Widget事件焦点

焦点(事件，ui ) 类型:自动完成焦点 当焦点移到项上时触发(不选择)。默认操作是将文本字段的值替换为焦点项的值，尽管只有当事件是由键盘交互触发的情况下。 取消此事件会阻止更新该值，但不会阻止重点关注菜单项。 代码示例 使用指定的焦点回调初始化自动完成： $( ".selector“).autocomplete({ focus: function( event ) {} })； 将事件侦听器绑定到自动完成焦点事件： $( ".selector“).on(”自动完成焦点“，函数(事件，ui ) {} )；