Jquery emulates Baidu Google search when the automatic supplement of search results prompt

  • 2020-03-30 01:07:19
  • OfStack

A good program is one that lazy people like. A good programmer is a lazy programmer. Yesterday, I studied Jquery to imitate the prompt of Baidu and Google to automatically supplement the search results, and the effect was ok. I want to share it with you. Jquery plug-ins required. See the code:
 
<script type="text/javascript"> 
$().ready( function () { 

$(":text").result(auto); 

function auto(data){ 
$("#keyWord").val(data.name); 
} 

$("#keyWord").autocomplete(obj, {//Obj is Json, an array of data objects
minChars: 0, //Represents the smallest character to be filled in before activation is completed automatically
max: 5, //Represents the number of items in the list
autoFill: true, //Means automatic fill
mustMatch: false, //It means that the entry must match, the input in the text field must be the data in the data parameter, if it does not match, the text field is cleared
matchContains: true, //Represents an inclusive match, equivalent to a fuzzy match
scrollHeight: 200, //Indicates the display height of the list. The default height is 180

formatItem: function (row) { 
return row.name; 
}, 
formatMatch: function (row) { 
return row.name; 
}, 
formatResult: function (row) { 
return row.value; 
} 
}); 
}); 
</script> 

The JSP:
 
<div> 
<h4>  imitation BaiDu,google Search prompt </h4> 
<table> 
<tr><td> Name: <input type="text" id="keyWord" /></td></tr> 
</table> 
</div> 

Related articles: