jsp实现了简单的注册界面

来源：互联网发布：织梦cms在线演示编辑：程序博客网时间：2024/05/16 08:04

<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
<style>
.a{color:#A6A6A6;
margin-left:8px;
border: 1px solid black;
width: 200px;
border-radius: 3px;
height: 30px;}
.b{
width:220px;
height:350px;
border:1px solid red;

}
.c{
margin-left:8px;
width:200px;
height: 30px;
color:white;
background-color:#DB6C41;
border-radius: 10px;
margin-top:20px}
</style>
<script src="jquery/jquery-3.2.1.js"></script>
<script>
$(document).ready(function(){
$("[name='txtphone']").focus(function(){
if($("[name='txtphone']").val()=="请输入电话号码"){
$("[name='txtphone']").val("");
$("[name='txtphone']").css("color","black");
}
});
$("[name='txtphone']").blur(function(){
if($("[name='txtphone']").val()==""){
$("[name='txtphone']").val("请输入电话号码");
$("[name='txtphone']").css("color","#A6A6A6");
}

});
$("[name='txtpass']").focus(function(){
if($("[name='txtpass']").val()=="请输入登录密码"){
$("[name='txtpass']").val("");
$("[name='txtpass']").attr("type","password");
$("[name='txtpass']").css("color","black");
}
});
$("[name='txtpass']").blur(function(){
if($("[name='txtpass']").val()==""){
$("[name='txtpass']").val("请输入登录密码");
$("[name='txtpass']").attr("type","text");
$("[name='txtpass']").css("color","#A6A6A6");
}
});
$("[name='txtpassword']").focus(function(){
if($("[name='txtpassword']").val()=="再次输入登录密码"){
$("[name='txtpassword']").val("");
$("[name='txtpassword']").attr("type","password");
$("[name='txtpassword']").css("color","black");
}
});
$("[name='txtpassword']").blur(function(){
if($("[name='txtpassword']").val()==""){
$("[name='txtpassword']").val("再次输入登录密码");
$("[name='txtpassword']").attr("type","text");
$("[name='txtpassword']").css("color","#A6A6A6");
}
});
$(":submit").on("click",function(){
var i=0;
if($("[name='txtphone']").val()=="请输入电话号码"){
i++;
alert("请输入电话号码！");
return false;
}else if($("[name='txtphone']").val().length<11){
i++;
alert("电话号码格式错误！");
return false;
}
if($("[name='txtpass']").val()=="请输入登录密码"){
i++;
alert("请输入登录密码！");
return false;
}else if($("[name='txtpass']").val().length<6){
i++;
alert("密码格式错误，请输入大于6位的密码！");
return false;
}
if($("[name='txtpassword']").val()=="再次输入登录密码"){
i++;
alert("请再次输入登录密码！");
return false;
}else if($("[name='txtpassword']").val()!=$("[name='txtpass']").val()){
i++;
alert("第二次输入的密码不等于第一次输入的！");
return false;
}
if(i==0){
return true;
}
});
});
</script>
</head>
<body>
<div class="b">
<form action="reshan.jsp">
<span style="margin-left:70px;margin-top:20px;color:red">欢迎注册</span>
<input type="text" value="请输入电话号码" name="txtphone" class="a" style="margin-top:40px"><br/>
<input type="text" value="请输入登录密码" name="txtpass" class="a" style="margin-top:20px"><br/>
<input type="text" value="再次输入登录密码" name="txtpassword" class="a" style="margin-top:20px"><br/>
<input type="submit" value="注册" class="c">
<a href="login.jsp"><input type="button" value="返回" class="c"></a>
</form>
</div>
</body>
</html>

阅读全文

0 0