zoukankan      html  css  js  c++  java
  • 文本框输入时,是实现自动提示(像百度、google一样)

    只要有三个文件:

    一个js插件autocomplete.js和autocomplete.css两个文件,这是jquery官方网站提供的插件;

    他们的下载地址:http://jqueryui.com/demos/autocomplete/ 

    一个是一般处理程序 ;

    一个是apsx页面,看下面的代码吧;

    前台:

    <script type="text/javascript">
            $(document).ready(function() {
                ShowUserList($("#TextBox1"), "LoginTest.ashx");
       //TextBox1为文本框的ID,loginTest.ashx为请求的一般处理程序。
                function ShowUserList(obj, url) {
                    $.getJSON(
                            url,
                            function(msg) {
                    var names = new Array();
                                msg = msg.Table;
                                var names = new Array();
                                for (var i = 0; i < msg.length; i++) {
                                    names.push(msg[i].loginName);
                                }
                                obj.focus().autocomplete(names);
                            }
                        );
                }
            });
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
        <div>
            用户名:<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
            <asp:Button ID="Button1" runat="server" Text="登录" />
        </div>
        </form>
    </body>

    后台是一般处理程序:

     public class LoginTest : IHttpHandler
        {

            string str;
            public void ProcessRequest(HttpContext context)
            {
                getUserName();
                
                context.Response.Write(str);
            }

            public bool IsReusable
            {
                get
                {
                    return false;
                }
            }
            private void  getUserName() 
            {
                DataSet ds = SqlHelper.BuildDataSet("select * from login", CommandType.Text);
                str = ConvertJson.ToJson(ds);
            }
        }

    运行结果:
     


  • 相关阅读:
    Python--day34--socket模块的方法
    Python--day32--ftp文件传输报错的原因
    Python--day32--struct模块
    Python--day32--复习:https和http的区别;黏包;黏包问题的解决方式;
    快捷键(随时补充)
    turtle 20秒画完小猪佩奇“社会人”
    Kibana使用教程
    Elasticsearch: 权威指南
    數據可視化大屏
    newtonsoft文檔說明
  • 原文地址:https://www.cnblogs.com/wggWeb/p/2427030.html
Copyright © 2011-2022 走看看