Simulez une liste déroulante de recherche floue similaire aux compétences Baidu Google_javascript

Copier le code Le code est le suivant :

// Document JavaScript
fonction onChangehoverLi(thisLi) {
$("#searchtext").val($(thisLi).html());
$("#suggest_ul").hide(0);
validateform2(); }

$(function(){
//Masquer le menu déroulant lors du chargement de
$("#suggest_ul").hide(0);
}); >
/ /Ajax obtient dynamiquement des mots-clés

//Écoutez les modifications d'entrée dans la zone de texte

fonction fuzzySearch(){

//Créer une fonction d'objet ajax
function createLink(){
if(window.ActiveXObject){
var newRequest = new ActiveXObject("Microsoft.XMLHTTP");
}else{
var newRequest = new XMLHttpRequest(); >}
return newRequest;
}

//Si la zone de texte est vide, n'envoyez pas la requête
if($("#searchtext").val().length ==0||$(" #searchtext").val().length>10){
$("#suggest_ul").hide(0>return;
}
//Envoyer la requête
http_request = createLink();//Créer un objet ajax
if(http_request){
var sid = $("#searchtext").val(); = "contentSearchAction!getSynonyms.action" ;
var data = "keywords=" encodeURI(sid);
//alert(data)
http_request.open("post",url,true); 🎜>http_request.setRequestHeader("content -type","application/x-www-form-urlencoded");

//Spécifiez une fonction pour traiter les résultats renvoyés par le serveur
http_request.onreadystatechange = dealresult; //Aucune parenthèse n'est requise pour cette fonction
//Envoyer la demande
http_request.send(data
}

//Traiter le résultat renvoyé
function dealresult); (){
if(http_request.readyState== 4){
//Égal à 200 signifie le succès
if(http_request.status==200){
if(http_request.responseText==" non"){
$("#suggest_ul") .hide(0);
return;

}
$("#suggest_ul").show(0);
var res = eval("(" http_request.responseText ") ");
var contents="";
for(var i=0;ivar mots-clés = res[i].keywords;
contents=contents "

" mots-clés "

";

}
$("# suggest_ul").html(contents);


}
}
}

}
//Souris
$(function(){

//Afficher l'invite déroulante 300 millisecondes après avoir appuyé sur la touche
$("#searchtext").keyup(function(){
setInterval(changehover,300);
function changehover() {
$("#suggest_ul li").hover(function(){ $(this).css("background","#eee ");},function(){ $(this).css(" background","#fff");});
}
});

});


Page :

Copier le code

Le code est le suivant : ;html xmlns="http://www.w3.org/1999/xhtml"> ;