首先，要引入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文件在附件中下载！
