js實現動態加載input 提示信息

思路：使用<datalist> 標籤訂義選項列表。請與 input 元素配合使用該元素，來定義 input 可能的值。datalist 及其選項不會被顯示出來，它僅僅是合法的輸入值列表。請使用 input 元素的 list 屬性來綁定 datalist。

1.在網頁加載的時候先把datalist選項值加載出來（一個數組），而且放置在一個全局變量中。

2.在輸入框中輸入信息的時候會觸發響應函數。

html代碼

<input type="text"  placeholder="學校名" autocomplete="on" list="mylist" onkeyup="search(this)"/>

<datalist id="mylist"></datalist>

 

js 代碼：

<script>
   var schoolList=["北京大學","清華大學","復旦大學","農業大學"];
    function search(obj){ 
        $("#mylist").empty();
        var tea_school=obj.value;
        for(i = 0; i < schoolList.length; ++i)
        {
            if(tea_school != "" && schoolList[i].match(tea_school + ".*") != null)
            {
                var option="<option>"+ schoolList[i] +"</option>";  
                $("#mylist").append(option);
            }
        }
    }
  </script>