jQuery UI自动完成部分匹配

时间:2013-03-02 20:35:53

标签: jquery jquery-ui jquery-autocomplete

我试图让jQuery UI Autocomplete搜索我的字符串的前几个字母。我以为我可以用jQuery UI做一个关键/值的事情,但我不确定是否适用。

我有以下字符串:

AGREE Agreement by and between BLANK, in BLANK, of the county records. 

只应搜索AGREE,而不是字符串的其余部分。 AGREE是用户将搜索的文本代码。

这是我的简单代码:

var availableTags = [
            "AGREE Agreement by and between BLANK, in BLANK, of the county records.",
            "CONDO Covenants, conditions, restrictions, reservations, terms, provisions, easements, liens for assessments, options, powers of attorney and limitations on title as set forth in the Ohio Revised Code Chapter 5311, or as set forth in the Declaration of Condominium ownership and Bylaws as recorded in BLANK, as amended, plat BLANK, of the county records."
        ];

$( "#tags" ).autocomplete({
 source: availableTags
});

只应搜索第一个单词AGREECONDO,而不是其他字符串。这可能/可行吗?

2 个答案:

答案 0 :(得分:1)

如果您只搜索标签,那么为什么不将标签放在数组中?

答案 1 :(得分:1)

我的解决方案是:

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>autocomplete demo</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.1/themes/base/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>
</head>
<body>
<label for="autocomplete">Select a programming language: </label>
<input id="autocomplete">
<script>
var tags = [ "c++", "java", "php", "coldfusion", "javascript", "asp", "ruby" ];
$( "#autocomplete" ).autocomplete({
source: function( request, response ) {
var matcher = new RegExp( "^" + $.ui.autocomplete.escapeRegex( request.term ), "i" );
response( $.grep( tags, function( item ){
return matcher.test( item );
}) );
}
});
</script>
</body>
</html>

参考。 http://api.jqueryui.com/autocomplete/#event-search(页面底部)