如何点击创建按钮的时候检测用户名是否存在,存在的话不允许注册,停留在原来页面并显示验证信息。采用的是点击创建按钮时验证调用action里面的add方法通过添加用户注册信息,并且跳转到注册成功页面。只要有一条不通过注册页面显示验证信息,而且停留在注册页面。
下面是jsp注册页面代码:
<%@ page contentType="text/html; charset=utf-8" language="java" import="java.sql.*" errorPage="" %>
<title>新新网--欢迎你的注册</title>
<head>
<script type="text/javascript" src="../js/register.js"></script>
<script language="javascript">
<!--
function CheckForm()
{
if (document.form.name.value.length == 0) {
document.form.name.focus();
return false;
}
var id = document.getElementById("p");
if (document.form.password.value.length == 0) {
id.innerHTML = "<font color='red'>密码不能为空!</font>";
document.form.password.focus();
return false;
}
var id = document.getElementById("t");
if (document.form.telephone.value.length == 0) {
id.innerHTML = "<font color='red'>手机号码不能为空!</font>";
document.form.telephone.focus();
return false;
}
if (document.form.email.value.length == 0) {
id.innerHTML = "<font color='red'>email不能为空!</font>";
document.form.email.focus();
return false;
}
var password = document.form.password.value;
var passwords = document.form.passwords.value;
if(password != passwords){
document.form.passwords.focus();
return false;
}
var phone = document.form.telephone.value;
var p =/1[358]/d{9,9}/;
chFlag = p.test(phone);
if(phone.length!=11 || !chFlag)
{
id.innerHTML = "<font color='red'>手机号码错误或为空!</font>";
document.form.telephone.focus();
return false;
}
var id = document.getElementById("e");
var email = document.form.email.value;
var e = /^([a-zA-Z0-9]|[._])+@([a-zA-Z0-9_-])+(/.[a-zA-Z0-9_-])+/;
chFlag = e.test(email);
if(chFlag){
id.innerHTML = "";
}else{
id.innerHTML = "<font color='red'>email错误格式或为空!</font>";
document.form.email.focus();
return false;
}
mdiv = document.getElementById("usermsg");
if(msg == "invalid") {
mdiv.innerHTML = "<font color='red'>用户名已存在!</font>";
document.form.name.focus();
return false;
}
return true;
}
-->
</script>
</head>
<div style="width:990px;"><%@include file="header.jsp"%></div>
<div>
<form name="form" method="post" action="${pageContext.request.contextPath}/User.html?method=Add" οnsubmit="return CheckForm();">
<table width="970px" style="font-size:16px" align="center" cellpadding="0" cellspacing="0" bordercolor="#CCCCCC">
<tr>
<td colspan="3" bgcolor="#3897E4">填写注册信息</td>
</tr>
<tr>
<td colspan="3" bgcolor="#D8F8FE">必填</td>
</tr>
<tr>
<td width="261" align="right" bgcolor="#D8F8FE"> 用 户 名:</td>
<td colspan="2" bgcolor="#D8F8FE">
<input id="userid" name="name" type="text" size=21 οnblur="validate()"/>
<span id="usermsg"></span></td>
</tr>
<tr>
<td align="right" bgcolor="#D8F8FE">密 码:</td>
<td colspan="2" bgcolor="#D8F8FE">
<input name="password" type=password size=23 οnkeyup="pwStrength(this.value)" οnblur="pwStrength(this.value)" />
<label id="p"></label></td>
</tr>
<tr bgcolor="#D8F8FE">
<td align="right" bgcolor="#D8F8FE"><div > 密码强度:</div></td>
<td width="568px" bgcolor="#D8F8FE"><table width="760px" bgcolor="#D8F8FE">
<tr width="50%" style="font-size:16px">
<td width="14%" id="strength_L">弱</td>
<td width="13%" id="strength_M">中</td>
<td width="15%" id="strength_H">强</td>
<td width="58%" id="strength_H"> </td>
</tr>
</table></td>
</tr>
<tr>
<td align="right" bgcolor="#D8F8FE">确认密码:</td>
<td colspan="2" bgcolor="#D8F8FE">
<input name="passwords" type="password" size=23 οnblur="pw()"/>
<label id="c" size=21></label></td>
</tr>
<tr>
<td align="right" bgcolor="#D8F8FE">手机号码:</td>
<td colspan="2" bgcolor="#D8F8FE">
<input name="telephone" type="text" size=21 οnblur="phone()" />
<label id="t"></label></td>
</tr>
<tr>
<td align="right" bgcolor="#D8F8FE">E-mail: </td>
<td colspan="2" bgcolor="#D8F8FE">
<input name="email" type="text" size=21 οnblur="mail()" />
<label id="e"></label></td>
</tr>
<tr>
<td colspan="3" align="right" width="50"></td>
</tr>
<tr>
<td colspan="3" bgcolor="#D8F8FE"> <div align="center" style="margin-top:10px;">
<input type="submit" name="button" id="button" value="创建用户"/ >
<input type="button" name="button2" id="button2" value="取消" />
</div></td>
</tr>
</table>
</form>
</div>
<div style="width:990px; text-align:center; margin-top:50px;"><%@include file="footer.jsp"%></div>
<script language="JavaScript">
document.form.name.focus();
</script>
register.js代码如下:
var req;
function validate() {
var idField = document.getElementById("userid");
var url = "Validate.jsp?id=" + escape(idField.value);
if(window.XMLHttpRequest) {
req = new XMLHttpRequest();
} else if (window.ActiveXObject) {
req = new ActiveXObject("Microsoft.XMLHTTP");
}
req.open("GET", url, true);
req.onreadystatechange = callback;
req.send(null);
}
function callback() {
if(req.readyState == 4) {
if(req.status == 200) {
var msg = req.responseXML.getElementsByTagName("msg")[0];
setMsg(msg.childNodes[0].nodeValue);
}
}
}
function setMsg(msg) {
mdiv = document.getElementById("usermsg");
if(msg == "invalid") {
mdiv.innerHTML = "<font color='red'>用户名已存在!</font>";
canSubmit = false;
return;
}
else if(msg == "valid"){
mdiv.innerHTML = "<font color='green'>您的用户名可用!</font>";
}else {
mdiv.innerHTML = "<font color='red'>用户名不能为空!</font>";
canSubmit = false;
return;
}
}
function CharMode(iN){
if (iN>=48 && iN <=57)
return 1;
if (iN>=65 && iN <=90)
return 2;
if (iN>=97 && iN <=122)
return 4;
else
return 8;
}
function bitTotal(num){
modes=0;
for (i=0;i<4;i++){
if (num & 1) modes++;
num>>>=1;
}
return modes;
}
function checkStrong(sPW){
if (sPW.length<=4)
return 0;
Modes=0;
for (i=0;i<sPW.length;i++){
Modes|=CharMode(sPW.charCodeAt(i));
}
return bitTotal(Modes);
}
function pwStrength(pwd){
var id = document.getElementById("p");
O_color="#eeeeee";
L_color="#FF0000";
M_color="#FF9900";
H_color="#33CC00";
if (pwd==null||pwd==''){
Lcolor=Mcolor=Hcolor=O_color;
id.innerHTML = "<font color='red'>密码不能为空!</font>";
}
else{
id.innerHTML = "<font color='green'></font>";
S_level=checkStrong(pwd);
switch(S_level) {
case 0:
Lcolor=Mcolor=Hcolor=O_color;
case 1:
Lcolor=L_color;
Mcolor=Hcolor=O_color;
break;
case 2:
Lcolor=Mcolor=M_color;
Hcolor=O_color;
break;
default:
Lcolor=Mcolor=Hcolor=H_color;
}
}
document.getElementById("strength_L").style.background=Lcolor;
document.getElementById("strength_M").style.background=Mcolor;
document.getElementById("strength_H").style.background=Hcolor;
return;
}
function pw(){
var password = document.form.password.value;
var passwords = document.form.passwords.value;
var id = document.getElementById("c");
if(password != passwords){
id.innerHTML = "<font color='red'>密码不一致!</font>";
}else{
id.innerHTML = "<font color='green'></font>";
}
}
function phone(){
var id = document.getElementById("t");
var phone = document.form.telephone.value;
var p =/1[358]/d{9,9}/;
chFlag = p.test(phone);
if(phone.length=11&chFlag){
id.innerHTML = "<font color='green'></font>";
}
else
{
id.innerHTML = "<font color='red'>手机号码错误或为空!</font>";
}
}
function mail(){
var id = document.getElementById("e");
var email = document.form.email.value;
var e = /^([a-zA-Z0-9]|[._])+@([a-zA-Z0-9_-])+(/.[a-zA-Z0-9_-])+/;
chFlag = e.test(email);
if(chFlag){
id.innerHTML = "";
}else{
id.innerHTML = "<font color='red'>email错误格式或为空!</font>";
}
}
function name_msg(n){
var n=n;
if(n==0){
name_use=true;
}
else{
name_use=false;
}
}
用完就删拿的网上的
最新推荐文章于 2024-02-19 16:44:54 发布