<script type="text/javascript">
//调用getText()方法,来判断正则表达式
getText();
//登录跳转事件方法
function skip(){
$(function(){
$.ajax({
url:"LoginServlet",
type:"post",
data:{
name:$("#name").val(),
pwd:$("#pwd").val(),
},
dataType:"text",
success:function(data){
if(data=="ok"){
window.location.href="succeed.jsp";
}else{
$("#losing").text("登录失败");
setTimeout(function(){
$("#losing").text("");
},3000);
}
}
});
});
}
//登录按钮事件
function loginBtn(){
//判断如果两个span标签中的值等于"对号
if ($("span").text() == "√√") {
//就改变按钮的背景,并添加点击事件
$("#login").css("background-color", "chartreuse");
$("#login").on("click", function() {
//调用跳转事件方法
skip();
});
} else {
//否则按钮背景不变,并删除点击事件
$("#login").css("background-color", "#CCCCCC");
$("#login").off("click");
}
}
//获取 输入框内容 与 正则表达式 做对比
function getText() {
var reg = [ /^[a-z]{5,12}$/, /^[a-z\d]{5,12}$/ ];
$(":text,:password").after("<span></span>").blur(function() {
if (reg[$(this).attr("data-index")].test($(this).val())) {
$(this).next("span").text("√").css("color", "green");
} else {
$(this).next("span").text("×").css("color", "red");
}
//当正则表达式判断后,调用按钮事件方法
loginBtn();
});
}
</script>