我已经能够使用innerHTML在下拉列表中显示结果但是动态创建Div元素并不是't clickable so now I'm . 但是,当用户按退格键时,我不确定如何清除列表 . 我以前用 document.getElementById('placeholder').innerHTML="" 语句做了这个 . 到目前为止_358773已经完成了 . 注释中的代码适用于我使用innerHTML显示下拉菜单的时间:

HTML代码:

<body>
  <input id="filter" type="text" placeholder="Enter your filter text here.."
   onkeyup="test()"/>

  <div id="lc">  
    <!--- <p id='placeholder'> </p>  -->
  </div>
  <script type="text/javascript" src="js/filter.js"></script>
</body>

JS代码:

// JavaScript Document
 s1 = new String()
 var myArray = new Array();

 myArray[0] = "Donald Duck";
 myArray[1] = "Winnie Pooh";
 myArray[2] = "Komal Waseem";
 myArray[3] = "Hockey";
 myArray[4] = "Basketball";
 myArray[5] = "Shooting";
 myArray[6] = "Mickey Mouse";

 function test() {
   s1 = document.getElementById('filter').value;
   var myRegex = new RegExp((s1),"ig");
   arraysearch(myRegex);
 }

 function arraysearch(myRegex) { 
   var flag=0;

   //document.getElementById('placeholder').innerHTML=""; 
   for(i=0; i<myArray.length; i++) { 
   //if(myArray[i].charAt(0).indexOf(s1) != -1) {
     if(myArray[i].match(myRegex)) { 
       flag = 1;
       //document.getElementById('lc').style.visibility = 'visible';
       //document.getElementById('placeholder').innerHTML += myArray[i]+"
"; var element = document.createElement("div"); element.appendChild(document.createTextNode(myArray[i])); document.getElementById('lc').appendChild(element); } //} if (flag == 0) { document.getElementById('lc').style.visibility='hidden'; } }