• jQuery completer 自动输入提示


    html代码:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
            <title>jQuery自动输入email、时间和域名</title>
            <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>
            <link rel="stylesheet" type="text/css" href="/api/jq/5733e35165ce0/completer.css"/>
            <script type="text/javascript" src="http://libs.useso.com/js/jquery/1.7.2/jquery.min.js"></script>
            <script src="/api/jq/5733e35165ce0/completer.min.js"></script>
            <script type="text/javascript">
                $(function() {
                    $("#auto-complete-email").completer({
                        separator: "@",
                        source: ["163.com", "qq.com", "126.com", "139.com", "gmail.com", "hotmail.com", "icloud.com"]
                    });
                    $("#auto-complete-time").completer({
                        filter: function(val) {
                            val = val.replace(/D/g, "").substr(0, 2);
                            if (val) {
                                val = parseInt(val, 10) || 0;
                                val = val > 23 ? 23 : val < 10 ? "0" + val : val;
                            }
                            return val;
                        },
                        separator: ":",
                        source: ["00", "05", "10", "15", "20", "25", "30", "35", "40", "45", "50", "55"]
                    });
                    var $autoCompleteDomain = $("#auto-complete-domain"), $autoCompleteGo = $("#auto-complete-go");
                    $autoCompleteDomain.completer({
                        complete: function() {
                            var url = "http://www." + $autoCompleteDomain.val();
                            $autoCompleteGo.attr("href", url);
                        },
                        separator: ".",
                        source: ["com", "net", "org", "co", "io", "me", "cn", "com.cn"]
                    });
                });
            </script>
        </head>
        <body>
            <div class="container">
                <div class="demo">
                    <p>1、输入邮箱号:</p>
                    <input type="text" id="auto-complete-email" class="input" placeholder="E-mail"/>
                    <p> </p>
                    <p>2、输入时间:</p>
                    <input type="text" id="auto-complete-time" class="input"/>
                    <p> </p>
                    <p>3、输入域名:</p>
                    <div class="input-group">
                        <span class="input-group-addon">www.</span>
                        <input id="auto-complete-domain" class="input" type="text" placeholder="请输入域名" autocomplete="off" />
                        <span class="input-group-btn">
                            <a id="auto-complete-go" class="btn btn-default" href="javascript:void(0);">Go!</a>
                        </span>
                    </div>
                </div>
            </div>
        </body>
    </html>
    

      

  • 相关阅读:
    那海蓝蓝 微博
    林子雨老师团队《Architecture of a Database System》 中文版
    MySQL优化---DBA对MySQL优化的一些总结
    MySQL索引原理及慢查询优化 美团
    MySQL 调优基础:Linux内存管理 Linux文件系统 Linux 磁盘IO Linux网络
    pthread_mutex_t
    知数堂MYSQL优化课---CU论坛版主 DBA 博客
    MySQL通用优化 叶金荣!!!
    MySQL 之 Metadata Locking 研究
    MySQL 调优基础(三) Linux文件系统
  • 原文地址:https://www.cnblogs.com/njccqx/p/5763043.html
Copyright © 2020-2023  润新知