我正在创建一个简单的应用程序来学习如何使用typeahead,但由于某种原因它不起作用,显示输入框但看不到搜索工作,我输入eng但没有显示任何内容,也无法找出原因。在Chrome 35和Firefox 30中都进行了测试。我必须做一些愚蠢但却无法弄清楚它是什么。
我在已包含的库和样式表上取得了200次成功,因此没有任何问题。
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<link href="css/bootstrap.css" rel="stylesheet">
<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>
<script type="text/javascript" src="js/lib/bootstrap.js"></script>
<script type="text/javascript" src="js/lib/typeahead.jquery.js"></script>
</head>
<body>
<input id="search"/>
</body>
<script>
var countries = ["england", "ireland", "scotland", "wales"];
$('#search').typeahead({source: countries});
console.log(countries);
</script>
答案 0 :(得分:0)
试试这段代码。我认为这正是你要找的。的 fiddle 强>
$(function () {
var substringMatcher = function (strs) {
return function findMatches(q, cb) {
var matches, substringRegex;
// an array that will be populated with substring matches
matches = [];
// regex used to determine if a string contains the substring `q`
substrRegex = new RegExp(q, 'i');
// iterate through the pool of strings and for any string that
// contains the substring `q`, add it to the `matches` array
$.each(strs, function (i, str) {
if (substrRegex.test(str)) {
// the typeahead jQuery plugin expects suggestions to a
// JavaScript object, refer to typeahead docs for more info
matches.push({
value: str
});
}
});
cb(matches);
};
};
var countries = ["england", "ireland", "scotland", "wales"];
$('#search').typeahead({
hint: true,
highlight: true,
minLength: 1
}, {
name: 'states',
displayKey: 'value',
source: substringMatcher(countries)
});
});