zoukankan      html  css  js  c++  java
  • JQuery cookie和validate的使用

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title></title>
        <style type="text/css">
            input:focus {
                border1px dotted black;
            }
     
            input.error {
                border1px dotted red;
            }
            /*label.error {
                 remove the next line when you have trouble in IE6 with labels in list 
                color: red;
                font-style: italic
            }*/
     
            label.error {
                backgroundurl("images/unchecked.gif") no-repeat 0px 0px;
                padding-left16px;
                padding-bottom2px;
                font-weightbold;
                color#EA5200;
            }
     
            label.checked {
                backgroundurl("images/checked.gif") no-repeat 0px 0px;
            }
        </style>
        <script src="Scripts/jquery-1.9.1.js"></script>
        <script src="Scripts/jquery.cookie.js"></script>
        <script src="Scripts/jquery.validate.js"></script>
     
        <script type="text/javascript">
            $(function () {
                //页面加载读取cookie的name
                var name = $.cookie("name");
                if (name) {
                    $("#txtName").val(name);
                }
     
                $("#btn").click(function () {
                    var name = $("#txtName").val();
                    var pwd = $("#txtPwd").val();
                    if (name == "admin" && pwd == "admin") {
                        $.cookie("name", name, { expires: 30 });
                        alert("登录成功");
                    } else {
                        alert("登录失败");
                    }
                });
     
     
                $("#f1").validate({
                    "messages":
                        {
                            "tname": { "required""请输入用户名""minlength""至少两个字符" },
                            "tpwd""请输入密码"
                        },
                    "success"function (label) {
                        label.addClass("checked");
                    }
                });
            });
        </script>
    </head>
    <body>
        <form id="form1" runat="server">
            <div>
                <input id="txtName" type="text" value="" /><br />
                <input id="txtPwd" type="text" value="" /><br />
                <input id="btn" type="button" name="name" value="Login" />
            </div>
        </form>
     
     
        <form id="f1" action="JQueryTest8.aspx">
            <table>
                <tr>
                    <td>用户名</td>
                    <td>
                        <input id="Text1" name="tname" class="required" minlength="2" type="text" />
                    </td>
                </tr>
                <tr>
                    <td>密码</td>
                    <td>
                        <input id="Text2" name="tpwd" class="required" type="text" />
                    </td>
                </tr>
                <tr>
                    <td>确认密码</td>
                    <td>
                        <input id="txtPwd1" name="tpwd" class="required" equalto="#txtPwd" type="text" />
                    </td>
                </tr>
                <tr>
                    <td>邮件</td>
                    <td>
                        <input id="txtMail" name="tmail" class="email" type="text" />
                    </td>
                </tr>
                <tr>
                    <td colspan="2">
                        <input id="Submit1" type="submit" value="submit" />
                    </td>
     
                </tr>
            </table>
        </form>
    </body>

    </html>

  • 相关阅读:
    shiro实战系列(三)之架构
    shiro实战系列(二)之入门实战续
    ShopNC B2B2C多用户商城2014商业版,带微商城
    开源 SHOPNC B2B2C结算营运版 wap IM客服 API 手机app 短信通知
    PHP5.3下加速器ZendGuardLoader安装 (LNMP/lnmpa)
    XAMPP + Xdebug+Zend Studio
    magento 12 配置安装教程
    C#控件一览表
    GetXamarin.xambe
    新建电子监控点与测速点
  • 原文地址:https://www.cnblogs.com/jiayue360/p/3168047.html
Copyright © 2011-2022 走看看