jquery自动填充自动填充字段,第一个值和高加法部分

im使用 jqueryui autocomplete插件与以下代码

$(this).autocomplete({
                source: function(request,response) {
                    $.ajax({ url: 'clinic/auto',data: { 'term': this.term,'name': this.element.attr('complete')},dataType: "json",type: "POST",success: function(data){
                        response(data);
                    }
                });
            },minLength: 2
        });

这将在下拉列表中显示所有结果的列表.

我的问题是如何让它自动完成工作,并突出显示添加的部分更容易使用？

我要编码吗？还是有现有的选择？
如果我要做手册怎么办？
示例图片：

解决方案至今：

我发现这个link and this是非常有用的(猴子修补jquery自动完成)编辑造型,但仍然不是我想要的..

解决方法

不幸的是,它没有现有的选项.幸运的是,使用JQuery Autocomplete提供的事件有一个非常简单的方法.查看这个JSfiddle： http://jsfiddle.net/RyTuV/133/

您会注意到,您要添加的相关代码使用JQuery Autocomplete Open event：

Triggered when the suggestion menu is opened or updated.

使用此事件,您可以将列表中第一个项目的文本添加到输入文件中已输入的内容,然后在输入文本之后突出显示添加到文本末尾：

$(this).autocomplete({
    source: function(request,response) {
                $.ajax({ url: 'clinic/auto',success: function(data){
                    response(data);
                }
            });
    },minLength: 2,open: function( event,ui ) {
        var firstElement = $(this).data("autocomplete").menu.element[0].children[0],inpt = $('#autocomplete'),original = inpt.val(),firstElementText = $(firstElement).text();

        /*
           here we want to make sure that we're not matching something that doesn't start
           with what was typed in 
        */
        if(firstElementText.toLowerCase().indexOf(original.toLowerCase()) === 0){
            inpt.val(firstElementText);//change the input to the first match

            inpt[0].selectionStart = original.length; //highlight from end of input
            inpt[0].selectionEnd = firstElementText.length;//highlight to the end
        }
    }
});

使用它作为模板,您可以循环选择菜单中的项目,以找到以输入文本开头的第一个匹配项,并使用它填充并突出显示,而不是仅使用第一个项目.

原文地址：https://www.jb51.cc/jquery/176421.html