Files installed/required for introduction
<script type= "Text/javascript" src= ". /js/jquery-1.8.3.min.js.js "></script>
<link href= ". /plug/autocomplete/styles.css "type=" Text/css "rel=" stylesheet "/>
<script type= "Text/javascript" src= ". /plug/autocomplete/jquery.autocomplete.js "></script>
Here is my relative path, the reader to use their own corresponding correct path
<input type= "text" id= "AutoComplete" value= "All"/>
elements that use plug-ins
OK, the following mainly from two aspects of the change plugin use: Local data, Ajax dynamic access to data
Local data
var countries = [
{value: ' American ', data: ' Us '},
{value: ' Chinese ', Data: ' ZH-CN '},
// ...
{value: ' 中文版 ', data: ' En '}
];
$ (' #autocomplete '). AutoComplete ({
Lookup:countries,
Onselect:function (suggestion) {
Alert (' You selected: ' + Suggestion.value + ', ' + suggestion.data);
}
});
So easy!
Ajax dynamically filters Server data
$ (' #autocomplete '). AutoComplete ({
Gets the URL of the server data
Serviceurl: ' Http://www.baidu.com/api ',
The parameter name passed to the server keyword, similar to the filter in the AJAX request $.post (URL, {' Filter ': keywords}, function () {})
ParamName: ' Filter ',
Transformresult:function (response) {
Parse the JSON string that the server passed over
var obj = $.parsejson (response);
return {
Suggestions: $.map (obj.list, function (DataItem) {
return {value:dataItem.right, data:dataItem.left};
})
};
},
Data processing after checking values
Onselect:function (suggestion) {
Beneficiarycode=suggestion.data;
Beneficiary=suggestion.value;
}
});
jquery Plugin AutoComplete use