//demo
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="css/styles.css"/>
<script src="js/jquery-1.11.3.js" type="text/javascript" charset="utf-8"></script>
<script src="js/jquery.mockjax.js"></script>
<script src="js/jquery.autocomplete.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
var countries ={}
//分组模糊搜索
var countries ={};
var phoneNumberTeams = [‘15556785678‘, ‘15567895678‘,‘15556896789‘,‘18867891235‘,‘13856235678‘,‘1397890456‘];
var roomNumberTeams = [ ‘8888‘,‘8899‘,‘8866‘,‘8800‘,‘6688‘,‘6666‘,‘8886‘,‘6600‘];
var nameNnmberTeams = [‘郭德纲‘,‘岳云鹏‘,‘成龙‘,‘刘德华‘,‘angelababy‘,‘8古天乐‘];
var phoneNumber = $.map(phoneNumberTeams, function (team) { return { value: team, data: { category: ‘手机号‘ }}; });
var roomNumber = $.map(roomNumberTeams, function (team) { return { value: team, data: { category: ‘房间号‘ } }; });
var nameNnmber = $.map(nameNnmberTeams, function (team) { return { value: team, data: { category: ‘姓名‘ } }; });
var teams = phoneNumber.concat(roomNumber,nameNnmber);
$(‘#indentSearchAutoComplete‘).devbridgeAutocomplete({
lookup: teams,
minChars: 1,
onSelect: function (suggestion) {
$(‘#selection‘).html(‘You selected: ‘ + suggestion.value + ‘, ‘ + suggestion.data.category);
},
showNoSuggestionNotice: true,
noSuggestionNotice: ‘对不起，没有搜索结果‘,
groupBy: ‘category‘
});
</script>
<title></title>
</head>
<body>
<h2>支持分组</h2>
<p>手机号/房号/姓名</p>
<div>
<input type="text" name="country" id="autocomplete"/>
</div>
</body>
</html>
链接地址 https://www.devbridge.com/sourcery/components/jquery-autocomplete/