JQuery plugin Ajax Autocomplete (Ajax auto-complete)

Usually with Baidu, Google search when there will be a drop-down list to prompt this is a very good feature this article is to introduce the jquery plugin called Ajax Autocomplete as the name implies that Ajax is the Ajax way to get the search hint information and then return to the rendered

Gossip doesn't say much directly on the code

The files used in this article are:

1, click Ajax Autocomplete for JQuery, version 1.1.3 download

Reference file:

<script type="text/javascript" src="jquery-1.3.2.min.js" ></script><script type="text/javascript " src= " Jquery.autocomplete.js"></script>

How to use:

Define a text box with ID query

<input type="text" name="query" id="Query  " />

<script type="Text/javascript">$ (function () {varOnautocompleteselect =function (value, data) {//customize some actions based on return results            }; varOptions ={serviceurl:'queryservices.ashx',//get the background page for dataWidth the,//width of the cue boxDelimiter:/(, |;) \s*/,//SeparatorsOnselect:onautocompleteselect,//the callback function after selectionDeferrequestby:0,//units microseconds                params: {Country:'Yes'},//ParametersNoCache:false //whether to enable caching by default is to turn on caching            }; A1= $('#easyQuery'). AutoComplete (options);    });} </script>

Here's the code that gets the data back.

Just mentioned ' queryservices.ashx ' This file, this is the background processing data file

Because this plugin requires the return result must be a JSON object The format of this JSON object is like this

{query:'Li',//query input from the foregroundsuggestions:['Liberia','Libyan Arab Jamahiriya','Liechtenstein','Lithuania'],//here is the data shown in the drop-down box and it is the one-key value corresponding to the followingdata:['LR','LY','LI','LT']//here and suggestions corresponds as the suggestions key}

Suggestions corresponds to the value of the foreground onautocompleteselect =function (value, data) callback function

Data, as the name implies, corresponds

Plug-in introduction so far the data transfer format has been listed and you can use your own language to serialize

JQuery plugin Ajax Autocomplete (Ajax auto-complete)