Jquery-autocomplete configuration:
<script type= "Text/javascript" src= "/js/jquery-1.4.2.min.js" ></script>
<script type= "Text/javascript" src= "/js/jquery.autocomplete.min.js" ></script>
<link rel= "Stylesheet" href= "/js/jquery.autocomplete.css"/>
A slightly more complex example, you can customize the list of hints:
1 2 3 <title> Custom Tips </title>
4 <script type= "Text/javascript" src= "/js/jquery-1.4.2.min.js" ></script>
5 <script type= "Text/javascript" src= "/js/jquery.autocomplete.min.js" ></script>
6 <link rel= "Stylesheet" href= "/js/jquery.autocomplete.css"/>
7 <script type= "Text/javascript" >
8 var emails = [
9 {name: "Peter Pan", to: "[email protected]"},
{Name: "Molly", To: "[email protected]"},
{name: "Forneria Marconi", to: "[email protected]"},
{name: "Master <em>Sync</em>" to: "[email protected]"},
{name: "Dr <strong>Tech</strong> de Log", To: "[email protected]"},
{name: "Don Corleone", To: "[email protected]"},
{name: "Mc Chick", to: "[email protected]"},
{name: "Donnie Darko", to: "[email protected]"},
{Name: "Quake the Net", to: "[email protected]"},
{Name: "Dr. Write", to: "[email protected]"},
{name: "GG Bond", to: "[email protected]"},
{name: "ZhuZhu Xia", to: "[email protected]"}
21];
22
$ (function () {
$ (' #keyword '). AutoComplete (Emails, {
Max:12,//list number of entries
minchars:0,//The minimum character entered before the activation is completed automatically
width:400,//width of hint, overflow hidden
scrollheight:300,//height of hint, overflow display scroll bar
Matchcontains:true,//contains a match, is the data parameter, whether the data contained in the text box is displayed
Autofill:false,//auto-fill
Formatitem:function (row, I, max) {
return i + '/' + Max + ': ' + row.name + ' "[' + row.to + '] ';
33},
Formatmatch:function (row, I, max) {
return row.name + row.to;
36},
PNS formatresult:function (Row) {
Row.to return;
39}
). Result (function (event, row, formatted) {
alert (row.to);
42});
43});
</script>
<body>
<form id= "Form1" runat= "Server" >
<div>
<input id= "keyword"/>
<input id= "GetValue" value= "GetValue" type= "button"/>
Wuyi </div>
</form>
</body>
jquery Auto-complete
