首先，要引入jquery.js、jquery.auto-complete.js、jquery.auto-complete.min.css.(重要)
demo代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="jquery.auto-complete.css"/>
<script src="jquery.js"></script>
<script src="jquery.auto-complete.min.js"></script>
</head>
<body>
<input id="hero-demo" autofocus type="text" name="q" placeholder="请输入关键字搜索..." style="width:100%;max-width:200px;outline:0">
<script>
$(function(){
var fe = ['ActionScript', '人口', 'Asp', 'Assembly', 'BASIC', 'Batch', 'C', 'C++', 'CSS', 'Clojure', 'COBOL', 'ColdFusion', 'Erlang', 'Fortran', 'Groovy', 'Haskell', 'HTML', 'Java'];
$('#hero-demo').autoComplete({
minChars: 1,
source: function(term, suggest){
term = term.toLowerCase();
var choices =fe;
var suggestions = [];
for (i=0;i<choices.length;i++)
if (~choices[i].toLowerCase().indexOf(term)) suggestions.push(choices[i]);
suggest(suggestions);
},
onSelect: function(e, term, item){
alert(1);
}
});
})
</script>
</body>
</html>
效果如下：
直接复制使用即可，js文件在附件中下载！
596
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
