あいまい検索(Baiduの検索ボックスのような)

4495 ワード

よくある検索ボックスです.よく使います.まとめてみます.自分が忘れてしまうのを恐れて、使っているのは元のjsです.
 これは原生が書いたものです.コードは簡単で、重要なのは考え方です.主に一つのindexOfを使いました.簡単です.簡単なものほど思いつかないですが、多くの人は正則でやりたいと思っています.これで遠ざけます.
html部分:
javascript部分:
//     
var array=["aaa","abc","aab","acc","bcc","caa"];
// id pop div ===========>
if (
document.getElementById("pop")) {

  divBox.removeChild(document.getElementById("pop"));

}
//       keyup  
document.getElementById('txt').οnkeyup=function(){
  var divBox = document.getElementById('box');
  //    
  var tmpArray = [];
  //            
  for(var i=0;i){
      //                 
      if(array[i].indexOf(this.value) === 0){
        //      push      
        tmpArray.push(array[i]);
      }
  }
  //
  if(tmpArray.length === 0){
       return;}
  //                
  if(this.value.length === 0){
    //
    if(document.getElementById("pop")){
        divBox.removeChild(document.getElementById("pop"));
    }
    return;
  }    
  //       
  var dvObj = document.creatElement("div");
   dvObj.id = "pop";
  // div   box 
  divBox.appendChild(dvObj);
  var ulObj=document.createElement("ul"); 
  // ul   dvObj 
  dvObj.appendChild(ulObj);
  //      ,    li
  for(var i = 0;i){
    var liObj = document.createElement("li");
    // tr   ulObj 
    ulObj.appendChild(liObj);
    //            li 
    setinnerText(liObj,tmpArray[i]);
  }
}
 
cssのデザインは書いていないので、間違いなく問題があります.あなた達に残しておくしかないです.全部書き終わりました.つまらなくなりました.私はピットが好きな人です.
 
転載先:https://www.cnblogs.com/ryze/p/ryze03.html