Home > Developer > Web Develop
JQuery search plugin auntocomplete and jquery search plugin
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<Html xmlns = "http://www.w3.org/1999/xhtml">
<Head>
<Title> Search plug-in </title>
<Link href = "http://www.imooc.com/data/jquery.autocomplete.css" rel = "stylesheet" type = "text/css"/>
<Link href = "style.css" rel = "stylesheet" type = "text/css"/>
<Script type = "text/javascript" src = "http://www.imooc.com/data/jquery-1.8.2.min.js"> </script>
<Script src = "http://www.imooc.com/data/jquery.autocomplete.js" type = "text/javascript"> </script>
</Head>
<Body>
<Div id = "divtest">
<Div class = "title">
<Span class = "fl"> Search plug-in </span>
</Div>
<Div class = "content">
<Span class = "fl"> User Name </span> <br/>
<Input id = "txtSearch" name = "txtSearch" type = "text"/>
<Div class = "tip">
</Div>
</Div>
</Div>
<Script type = "text/javascript">
$ (Function (){
Var arrUserName = ["Wang Wu", "Liu Ming", "Li xiaosi", "Liu zhengming", "Li Yuan", "Zhang xiaosan", "Wang Xiaoming"];
$ ("# TxtSearch"). autocomplete (arrUserName ,{
MinChars: 0, // when you double-click a blank text box, all the prompt data is displayed.
FormatItem: function (data, I, total ){
Return "<I>" + data [0] + "</I>"; // change the display format of matching data.
},
FormatMatch: function (data, I, total ){
Return data [0];
},
FormatResult: function (data ){
Return data [0];
}
}). Result (SearchCallback );
Function SearchCallback (event, data, formatted ){
$ (". Tip" ).show().html ("your choice is:" + (! Data? "Null": formatted ));
}
});
</Script>
</Body>
</Html>
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
