如何在键入时过滤 jquery 自动完成数据 [英] How to filter your jquery autocomplete data while typing

问题描述

到目前为止，我有以下内容

So far I have the following

var aCleanData = ['aaa','aab','faa','fff','ffb','fgh','mmm','maa'];

$('#my-input').autocomplete({
    source:aCleanData,
    minLength:2
});

目前如果你输入aa，aaa,aab,faa,maa 将会显示.

Currently if you type aa, aaa,aab,faa,maa will show.

我想做的是当用户输入 ff 时显示的数据将是 fff,ffb 数据.

What I would like to do is when the user types ff the data that is shown will be the fff,ffb data.

基本上，只有输入的内容才能从第一个字符开始匹配.

Basically, only what is typed should be matched from the first character onwards.

这应该是递归的.当用户输入fg时，fff,ffb应该消失，只有fgh应该出现.

This should be recursive. When user types fg, fff,ffb should disapear and only fgh should appear.

预先感谢您的帮助.

更新:

附言明白我的意思:

http://jqueryui.com/demos/autocomplete/#default

输入 sc，您将看到的不仅仅是以 sc 开头的数据.

Type sc and you'll see more than just the data beginning with sc.

推荐答案

只获取以输入值开头的结果的一种可能解决方案是在自己搜索之前检查数组元素:

One possible solution to get only results starting with the input value is to check the array elements before search by yourself:

var aCleanData = ['aaa','aab','faa','fff','ffb','fgh','mmm','maa'];
$('#my-input').autocomplete({
    source: aCleanData,
    minLength: 2,
    search: function(oEvent, oUi) {
        // get current input value
        var sValue = $(oEvent.target).val();
        // init new search array
        var aSearch = [];
        // for each element in the main array ...
        $(aCleanData).each(function(iIndex, sElement) {
            // ... if element starts with input value ...
            if (sElement.substr(0, sValue.length) == sValue) {
                // ... add element
                aSearch.push(sElement);
            }
        });
        // change search array
        $(this).autocomplete('option', 'source', aSearch);
    }
});

另见我的 jsfiddle.

这篇关于如何在键入时过滤 jquery 自动完成数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！