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 {
border: 1px dotted black;
}
input.error {
border: 1px 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 {
background: url("images/unchecked.gif") no-repeat 0px 0px;
padding-left: 16px;
padding-bottom: 2px;
font-weight: bold;
color: #EA5200;
}
label.checked {
background: url("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>
