• 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>

  • 相关阅读:
    2.8
    2.7
    2.6
    2.5
    2.4第三篇读后感
    2.2第一篇读后感
    2.1
    字符统计
    6468: Snuke's Coloring
    6463: Tak and Hotels II
  • 原文地址:https://www.cnblogs.com/mark5/p/10944082.html
Copyright © 2020-2023  润新知