標籤：
//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/
jquery.autocomplete 模糊查詢 支援分組
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
