2013-03-02 69 views
0

我想让jQuery UI自动完成只搜索我的字符串的前几个字母。我认为我可以用jQuery UI做关键/价值的事情,但我不确定这是否适用。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应搜索,而不是字符串的其余部分。这可能/可行吗?

+0

可能的[jQuery UI自动填充小部件搜索配置]的副本(http://stackoverflow.com/questions/2382497/jquery-ui-autocomplete-widget-search-configuration)。看看[this](http://stackoverflow.com/a/2405109/303270)的答案。 – fardjad 2013-03-02 20:41:05

回答

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(页面底部)

1

如果你只是在寻找标签,那你为什么不把标签放在数组中呢?

+0

是的,但我需要文本的其余部分在文本框中自动填充。 – user1477388 2013-03-02 20:41:04

+1

我的建议是在关键字被选中后使用jQuery'append()'添加文本。 – 2013-03-02 20:45:13

+0

你对这个页面的底部有什么看法http://api.jqueryui.com/autocomplete/#event-search它说:“**演示:例子:使用自定义源回调来匹配术语的开始**“你认为我可以使用它吗?这听起来像我想要做的... – user1477388 2013-03-02 20:46:41