html - 在自动完成数据列表中仅选择字母是起始字母的值

Question

我正在为我的自动完成字段使用datalist 。它工作正常。我的列表中有值james、reeta 和 mary，如果我在自动完成框中输入“r”，它会返回值 reeta 和 mary，因为 mary 还包含字母“r”。但我不希望我的自动完成功能像这样工作。我只想要reeta 而不是 mary这意味着以输入的字母作为起始字母的值。

Answer 1

使用source选项来实现您自己的搜索：

var dataSource = ['mary', 'reeta', 'james'];

$("input").autocomplete({
    minLength: 1,
    source: function(request, response) {

        var matcher = new RegExp( '^' + $.ui.autocomplete.escapeRegex(request.term), "i" );
        var filteredData = $.grep( dataSource, function(value) {
            return matcher.test( value.label || value.value || value );
        });
        response(filteredData);
    }
});

示例http://jsfiddle.net/AU92X/8/

或者你甚至可以通过重写使其全局化$.ui.autocomplete.escapeRegex：

var dataSource = ['mary', 'reeta', 'james'];

$("input").autocomplete({
    minLength: 1,
    source: dataSource
});

var escapeRegexp = $.ui.autocomplete.escapeRegex;
$.extend( $.ui.autocomplete, {
    escapeRegex: function( value ) {
        return '^' + escapeRegexp(value);
    }
});

示例http://jsfiddle.net/AU92X/10/