- 浏览: 325985 次
- 性别:
- 来自: 武汉
文章分类
最新评论
-
di1984HIT:
学习了~
Spring scope="prototype" -
netkiller.github.com:
路还很长看看我的博客 http://netkiller.git ...
写博客是个好习惯 -
ooo456mmm:
JAVA 设计模式之——动态代理 -
hanmiao:
问题是这么问的:请使用 Java 的基本数据类型表示壹下单链表 ...
JAVA数据结构之——单链表的逆序 -
hanmiao:
谢谢,今天刚好有人问我这个问题,结果没有答上来,看了你这篇文章 ...
JAVA数据结构之——单链表的逆序
用户注册时用到的各种js代码(ajax验证)
最近在做前台开发时,遇到一个用户注册的页面,里面需要进行各种各样的验证:身份证号码检查,用户名、邮箱是否存在(AJAX技术)等等。
页面见附件。
具体页面代码:
<%@ page language="java" contentType="text/html; charset=GBK" pageEncoding="GBK"%> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=GBK" /> <title>用户注册</title> <link href="../css/zhuce.css" rel="stylesheet" type="text/css" /> <link href="../css/gonggong.css" rel="stylesheet" type="text/css" /> <script language="javascript" type="text/javascript" src="../common/js/flash.js"></script> <script language="javascript" type="text/javascript" src="../js/mootools.js"></script> <!--检查各种限制--> <script language="javascript"> var flagEMAIL = false; var flagACCOUNT_NAME = false; var flagNICK_NAME = false; var flagUSER_NUMBER = false; function checkInfo(codeType, viewType, codeTY) { var xmlHttp; try {// Firefox, Opera 8.0+, Safari xmlHttp = new XMLHttpRequest(); } catch (e) {// Internet Explorer try { xmlHttp = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) { alert("您的浏览器不支持AJAX!"); return false; } } } xmlHttp.onreadystatechange = function() { if (xmlHttp.readyState == 4) { var result = xmlHttp.responseText; if(result == 1){ document.getElementById(viewType).style.color = "#00FF00"; document.getElementById(viewType).innerHTML = "OK"; eval("flag"+codeTY +" = true"); } else { document.getElementById(viewType).style.color = "#FF0000"; document.getElementById(viewType).innerHTML = result; eval("flag"+codeTY +" = false"); } } }; var codeValue = document.getElementById(codeType).value; var url = "./check_info"; url = url + "?codeTY=" + codeTY + "&codeValue=" + codeValue; xmlHttp.open("GET", url, true); xmlHttp.send(null); } function ConcetEmail() { if(checkEmail() == false) { return false; } checkInfo("email", "tetEm", "EMAIL"); return flagEMAIL; } function checkEmail() { var re = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(\.[a-zA-Z0-9_-])+/; var email = document.formlogo.email.value; if (email != null && email.length > 0) { if (!re.test(email)) { alert("对不起,你输入的Email不合法!"); document.formlogo.email.focus(); return false; } else { return true; } } else { return true; } } function checkAccountName() { if(checkNameByRE() == false) { return false; } checkInfo("accountName", "tetAccName", "ACCOUNT_NAME"); return flagACCOUNT_NAME; } function checkNickName() { checkInfo("nickName","tetNick","NICK_NAME"); return flagNICK_NAME; } function checkUserNumber() { if(checkUserId() == false) { return false; } checkInfo("userNumber", "tetId", "USER_NUMBER"); return flagUSER_NUMBER; } </script> <!-- 必填项不可为空 --> <script language="javascript"> function checkPwdLength(pwd) { var v = pwd.value; if(v.length>7 && v.length<17) return false; else return true; } function on_submit() { if (checkAccountName() == false) { document.formlogo.accountName.focus(); return; } if (document.formlogo.password.value == "") { alert("用户密码不能为空,请输入密码!"); document.formlogo.password.focus(); return; } if (checkPwdLength(document.formlogo.password)) { alert("请重新输入8-16位密码"); document.formlogo.password.focus(); return; } if (document.formlogo.repaswod.value == "") { alert("用户确认密码不能为空,请输入密码!"); document.formlogo.repaswod.focus(); return; } if (checkPwdLength(document.formlogo.repaswod)) { alert('请重新输入8-16位密码'); document.formlogo.repaswod.focus(); return; } if (document.formlogo.password.value != document.formlogo.repaswod.value) { alert("密码与确认密码不同"); document.formlogo.repaswod.focus(); return; } if (checkNickName() == false) { document.formlogo.nickName.focus(); return; } if (document.formlogo.userName.value == "") { alert("玩家姓名不能为空,请输入姓名!"); document.formlogo.userName.focus(); return; } var UserId = document.formlogo.userNumber.value; if (UserId.length != 18 && UserId.length != 15) { alert("请输入合法的身份证件号码!!"); document.formlogo.userNumber.focus(); return; } var age = document.formlogo.age.value; if (isNaN(age) || age == "") { alert('请填写正确的年龄'); document.formlogo.age.focus(); return; } if (document.formlogo.userNumber.value == "") { alert("身份证不能为空,请输入身份证号码!"); document.formlogo.userNumber.focus(); return; } if (document.formlogo.question.value == "") { alert("密保问题不能为空,请输入密保问题!"); document.formlogo.question.focus(); return; } if (document.formlogo.answer.value == "") { alert("密保答案不能为空,请输入密保答案!"); document.formlogo.answer.focus(); return; } if (checkUserNumber() == false) { return; } if(ConcetEmail() == false) { return; } if (!document.formlogo.xieyi.checked) { alert("您仔细阅读我们的用户协议"); document.formlogo.xieyi.focus(); return; } document.formlogo.submit(); } </script> <script language="javascript"> function checkNameByRE() { var accountName = document.formlogo.accountName.value; var wordch; for (i = 0; i < accountName.length; i++) { ch = accountName.charCodeAt(i); if (!(ch >= 65 && ch <= 90) && !(ch >= 97 && ch <= 122) && !(ch >= 48 && ch <= 57) && !(ch == 45)) { alert("用户名只能是英文字母和数字。"); document.formlogo.accountName.focus(); return false; } } return true; } </script> <!-- 身份证检测 --> <script language="javascript"> var vcity = { 11 : "北京", 12 : "天津", 13 : "河北", 14 : "山西", 15 : "内蒙古", 21 : "辽宁", 22 : "吉林", 23 : "黑龙江", 31 : "上海", 32 : "江苏", 33 : "浙江", 34 : "安徽", 35 : "福建", 36 : "江西", 37 : "山东", 41 : "河南", 42 : "湖北", 43 : "湖南", 44 : "广东", 45 : "广西", 46 : "海南", 50 : "重庆", 51 : "四川", 52 : "贵州", 53 : "云南", 54 : "西藏", 61 : "陕西", 62 : "甘肃", 63 : "青海", 64 : "宁夏", 65 : "新疆", 71 : "台湾", 81 : "香港", 82 : "澳门", 91 : "国外" }; function checkCard() { var cardidstr = document.formlogo.userNumber.value; if (cardidstr.length == 18) { return check18Card(cardidstr); } else if (cardidstr.length == 15) { return check15Card(cardidstr); } else if(cardidstr.length != 0){ alert("身份地址不符合要求!"); document.formlogo.userNumber.value = ""; document.formlogo.userNumber.focus(); return false; } else { return true; } } function check18Card(cardidstr) { var ycode = cardidstr.substr(cardidstr.length - 1); var cardLastCode = ycode.charCodeAt(ycode); var isum = 0; var re = /^\d{17}(\d|X)$/i; if (cardidstr != null && cardidstr.length > 0) { if (!re.test(cardidstr)) { alert("卡号不符合要求!"); document.formlogo.userNumber.focus(); return false; } if (vcity[parseInt(cardidstr.substr(0, 2))] == null) { alert("身份地址不符合要求!"); document.formlogo.userNumber.focus(); return false; } else { document.formlogo.address.value = vcity[parseInt(cardidstr.substr(0, 2))]; } sbirthday = cardidstr.substr(6, 4) + "-" + Number(cardidstr.substr(10, 2)) + "-" + Number(cardidstr.substr(12, 2)); var date = new Date(sbirthday.replace(/-/g, "/")); if (sbirthday != (date.getFullYear() + "-" + (date.getMonth() + 1) + "-" + date.getDate())) { alert("出生日期非法!" + date.getFullYear() + "-" + date.getMonth() + "-" + date.getDate()); document.formlogo.userNumber.focus(); return false; } if (cardLastCode != 120 && cardLastCode != 88) { for ( var i = 17; i >= 0; i--) { isum += (Math.pow(2, i) % 11) * parseInt(cardidstr.charAt(17 - i), 11); } if (isum % 11 != 1) { alert("身份证非法!"); document.formlogo.userNumber.focus(); return false; } } return true; } else { document.formlogo.userNumber.focus(); return false; } } function check15Card(cardidstr) { var isum = 0; var re = /^\d{14}(\d|X)$/i; if (cardidstr.length > 0 && cardidstr != null) { if (!re.test(cardidstr)) { alert("卡号不符合要求!"); document.formlogo.userNumber.focus(); return false; } if (vcity[parseInt(cardidstr.substr(0, 2))] == null) { alert("身份地址不符合要求!"); document.formlogo.userNumber.focus(); return false; } else { document.formlogo.address.value = vcity[parseInt(cardidstr.substr(0, 2))]; } sbirthday = "19" + cardidstr.substr(6, 2) + "-" + Number(cardidstr.substr(8, 2)) + "-" + Number(cardidstr.substr(10, 2)); var date = new Date(sbirthday.replace(/-/g, "/")); if (sbirthday != (date.getFullYear() + "-" + (date.getMonth() + 1) + "-" + date.getDate())) { alert("出生日期非法!" + date.getFullYear() + "-" + date.getMonth() + "-" + date.getDate()); document.formlogo.userNumber.focus(); return false; } return true; } else { alert("请输入身份证号!"); document.formlogo.userNumber.focus(); return false; } } function checkUserId() { if(checkCard() == false) { return false; } UserId = document.formlogo.userNumber.value; uid_length = UserId.length; if (uid_length == 18) { userbrith = UserId.substr(6, 4); theDate = new Date(); today = theDate.getYear(); userage = today - userbrith; document.formlogo.age.value = userage; userSex = UserId.substr(16, 1); if (userSex % 2 == 1) { document.formlogo.man.checked = true; } else { document.formlogo.women.checked = true; } } else if(uid_length == 15){ userbrith = "19" + UserId.substr(6, 2); theDate = new Date(); today = theDate.getYear(); userage = today - userbrith; document.formlogo.age.value = userage; userSex = UserId.substr(14, 1); } else { return true; } return true; } function checkAge() { var age = document.formlogo.age.value; if (isNaN(age)) { alert('请填写正确的年龄'); document.formlogo.age.value = ""; document.formlogo.age.focus(); return; } } </script> </head> <body> <div class="all"> <div class="logo"><a href="http://www.dekaron.com.cn/"><img src="../images/logo.jpg" /></a></div> <div class="nav"><div class="lj_f"></div> <div class="flash"><script type="text/javascript">setFlash("http://image.dekaron.com.cn/common/menu/submenu2.swf?top_num=2&main_num=2",690,60);</script> </div></div> <br class="ml_ClearFloat" /> <div class="main"> <img src="../images/zhzc.jpg" /> <p class="p">登录注册成功后,能享受公司提供的精彩游戏和其他业务</p> <div class="hui"> <p>本网站的游戏全部已经纳入“网络游戏防沉迷系统”,所以为了维护您的自身权益和游戏帐号安全,请务必填写真实,准确的姓名与身份证号码。</p> </div> <form name="formlogo" method="post" action="join_member" id="formlogo"> <div class="mainform"> <p><font>用户名和昵称注册后不能修改,请慎重填写</font></p> <table width="630" border="1" cellpadding="0" cellspacing="0" style="border-color:#CCCCCC; border-collapse:collapse;"> <tr> <td width="115" height="27" align="left" valign="middle" bgcolor="#EFEFEF"><img src="../images/hoverlibj.jpg" class="mr5"/>用户名</td> <td class="p5"><input type="text" name="accountName" class="text" id="accountName" onblur="checkAccountName()"/><span id="tetAccName" ></span></td> </tr> <tr> <td width="115" height="27" align="left" valign="middle" bgcolor="#EFEFEF"><img src="../images/hoverlibj.jpg" class="mr5"/>密码</td> <td class="p5"><input type="password" name="password" class="text" /><span style='color:#FF0000'>由8~16个数字和英文字母组成 (特殊字符不可以用)</span></td> </tr> <tr> <td width="115" height="27" align="left" valign="middle" bgcolor="#EFEFEF"><img src="../images/hoverlibj.jpg" class="mr5"/>重复密码</td> <td class="p5"><input type="password" name="repaswod" class="text" /><span style='color:#FF0000'>由8~16个数字和英文字母组成 (特殊字符不可以用)</span></td> </tr> <tr> <td width="115" height="27" align="left" valign="middle" bgcolor="#EFEFEF"><img src="../images/hoverlibj.jpg" class="mr5"/>昵称</td> <td class="p5"><input type="text" name="nickName" id="nickName" class="text" onblur="checkNickName()" /><span id="tetNick"></span></td> </tr> </table> <p style="margin-top:20px; border-top:1px dashed #CCC;"><font>以真实姓名和身份证号码为本人确认的唯一根据,同时是防沉迷系统是否纳入的根据,请慎重填写。</font></p> <table width="630" border="1" cellpadding="0" cellspacing="0" style="border-color:#CCCCCC; border-collapse:collapse;"> <tr> <td width="115" height="27" bgcolor="#EFEFEF"><img src="../images/hui.jpg" class="mr5" />真实姓名</td> <td class="p5"><input type="text" name="userName" id="userName" class="text" /></td> </tr> <tr> <td width="115" height="27" bgcolor="#EFEFEF"><img src="../images/hui.jpg" class="mr5" />身份证号码</td> <td class="p5"><input type="text" name="userNumber" id="userNumber" class="text" onblur="checkUserNumber()"/><span id="tetId"></span></td> </tr> <tr> <td width="115" height="27" bgcolor="#EFEFEF"><img src="../images/hui.jpg" class="mr5" />玩家性别</td> <td class="p5"><input type="radio" checked="checked" name="sex" value="1" id="man" />男 <input type="radio" name="sex" value="0" id="women" />女</td> </tr> <tr> <td width="115" height="27" bgcolor="#EFEFEF"><img src="../images/hui.jpg" class="mr5" />玩家年龄</td> <td class="p5"><input type="text" name="age" onblur="checkAge()"/></td> </tr> <tr> <td width="115" height="27" bgcolor="#EFEFEF"><img src="../images/hui.jpg" class="mr5" />玩家联系地址</td> <td class="p5"><input type="text" name="address" id="address"/></td> </tr> <tr> <td width="115" height="27" bgcolor="#EFEFEF"><img src="../images/hui.jpg" class="mr5" />玩家联系电话</td> <td class="p5"><input type="text" name="phone" id="phone" /></td> </tr> </table> <div class="blank20"></div> <table width="630" border="1" cellpadding="0" cellspacing="0" style=" border-color:#CCCCCC; border-collapse:collapse; margin-top:20px;"> <tr> <td width="115" height="27" align="left" valign="middle" bgcolor="#EFEFEF"><img src="../images/hoverlibj.jpg" class="mr5"/>密保问题</td> <td class="p5"><input type="text" name="question" class="text" /></td> </tr> <tr> <td width="115" height="27" align="left" valign="middle" bgcolor="#EFEFEF"><img src="../images/hoverlibj.jpg" class="mr5"/>密保问题答案</td> <td class="p5"><input type="text" name="answer" class="text" /></td> </tr> <tr> <td width="115" height="55" rowspan="2" align="left" valign="middle" bgcolor="#EFEFEF"><img src="../images/hoverlibj.jpg" class="mr5"/>邮 箱</td> <td height="25" align="left" valign="middle" class="p5"> <input type="text" name="email" id="email" onblur="ConcetEmail()" class="text"/><span id="tetEm"></span></td> </tr> <tr> <td height="20" align="left" valign="middle" class="p5"><a href="http://www.sina.com.cn" style="color:#F00; text-decoration:underline;">推荐您使用新浪邮箱</a></td> </tr> </table> <p style="color:#666;margin-top:20px;"><input type="checkbox" name="xieyi" /><a href="./agreement" target="_blank"> 我已阅读并同意《用户协议》里的所有内容</a></p> <div class="zhuce"><img src="../images/zcanbj.jpg" style="cursor:pointer;" onclick="on_submit()" /></div> </div> </form> </div> <!--footer--> <div class="ml_foot"> <a class="ml_footLogo" href="index.html"></a> <div class="ml_footText"><br /> <ul> <li><a href="http://www.dekaron.com.cn/loding/index.html"> 关于我们 </a>|</li> <li><a href="http://www.dekaron.com.cn/loding/index.html"> 网站地图 </a>|</li> <li><a href="http://www.dekaron.com.cn/loding/index.html"> 异业合作 </a></li> </ul> <p>24小时客户服务热线:4006-700-560 | 传真:010-59312600| 客服邮箱:<a href="mailto:services@dekaron.com.cn">services@dekaron.com.cn</a></p> <p>版权所有BEIJING WONDERSERVICE TEC&DEV CO.,LTD 北京文德荣达科技开发有限公司</p> </div> </div> </div> </body> </html>
做AJAX验证,提交到CheckInfoAction:
package com.ultratech.wdrd.action.regist; import javax.annotation.Resource; import org.apache.struts2.convention.annotation.ParentPackage; import org.springframework.stereotype.Controller; import com.ultratech.base.framework.BaseAction; import com.ultratech.wdrd.service.CheckService; @SuppressWarnings("serial") @Controller @ParentPackage("userplat-noauth") public class CheckInfoAction extends BaseAction { @Resource private CheckService service; private String codeTY; private String codeValue; private String message; private static final String OK = "1"; public void prepare() throws Exception { } @Override public String execute() throws Exception { message = OK; if(codeValue != null && codeValue.length() != 0) { if(codeTY.equals("ACCOUNT_NAME")) { if( service.checkAccountNameExist(codeValue)) { message = "用户已存在!"; } } else if(codeTY.equals("NICK_NAME")) { if( service.checkNickNameExist(codeValue)) { message = "昵称已存在!"; } } else if(codeTY.equals("USER_NUMBER")) { if( service.checkUserNumberExist(codeValue)) { message = "身份证号码已存在!"; } } else if(codeTY.equals("EMAIL")) { if( service.checkEmailExist(codeValue)) { message = "邮箱已存在!"; } } else { message = "未知的检测数据"; } } else { message = "*必填"; } return SUCCESS; } public String getCodeTY() { return codeTY; } public void setCodeTY(String codeTY) { this.codeTY = codeTY; } public String getCodeValue() { return codeValue; } public void setCodeValue(String codeValue) { this.codeValue = codeValue; } public String getMessage() { return message; } }
- signup.rar (17.1 KB)
- 下载次数: 61
相关推荐
jquery框架实现的ajax 验证用户名是否存在的部分JS 代码如下: $(“#accounts”).formValidator({onshow:”请输入用户名”,onfocus:”用户名至少4个字符,最多10个字符”,oncorrect:”该用户名可以注册”})....
当用户发送第一次请求的时候,验证用户登录,创建一个该qq号和服务器端保持通讯连接得线程,启动该通讯线程,通讯完毕,关闭Scoket。 QQ客户端登录界面,中部有三个JPanel,有一个叫选项卡窗口管理。还可以更新...
当用户发送第一次请求的时候,验证用户登录,创建一个该qq号和服务器端保持通讯连接得线程,启动该通讯线程,通讯完毕,关闭Scoket。 QQ客户端登录界面,中部有三个JPanel,有一个叫选项卡窗口管理。还可以更新...
当用户发送第一次请求的时候,验证用户登录,创建一个该qq号和服务器端保持通讯连接得线程,启动该通讯线程,通讯完毕,关闭Scoket。 QQ客户端登录界面,中部有三个JPanel,有一个叫选项卡窗口管理。还可以更新...
表单输入验证功能,提交后提示预定信息,导航栏功能、AJAX城市天气预报查询功能,网站界面美观,布局配色合理,方便和吸引用户的使用。包含10个以上自己设计的超链接页面。 具体要求为: (1) 网站主题为爱旅行旅游...
当用户发送第一次请求的时候,验证用户登录,创建一个该qq号和服务器端保持通讯连接得线程,启动该通讯线程,通讯完毕,关闭Scoket。 QQ客户端登录界面,中部有三个JPanel,有一个叫选项卡窗口管理。还可以更新...
表单输入验证功能,提交后提示预定信息,导航栏功能、AJAX城市天气预报查询功能,网站界面美观,布局配色合理,方便和吸引用户的使用。包含10个以上自己设计的超链接页面。 具体要求为: (1) 网站主题为爱旅行旅游...
-Grid增加GetNoSelectionAlertInParentReference函数,用来表示没有选中任何一项时在父页面弹出对话框的JS代码。 -修正IE7下不能以下划线作为CSS中类名的前缀的BUG(feedback:Steve.Wei)。 -添加定时器控件Timer,...
当用户发送第一次请求的时候,验证用户登录,创建一个该qq号和服务器端保持通讯连接得线程,启动该通讯线程,通讯完毕,关闭Scoket。 QQ客户端登录界面,中部有三个JPanel,有一个叫选项卡窗口管理。还可以更新...
当用户发送第一次请求的时候,验证用户登录,创建一个该qq号和服务器端保持通讯连接得线程,启动该通讯线程,通讯完毕,关闭Scoket。 QQ客户端登录界面,中部有三个JPanel,有一个叫选项卡窗口管理。还可以更新...
-Grid增加GetNoSelectionAlertInParentReference函数,用来表示没有选中任何一项时在父页面弹出对话框的JS代码。 -修正IE7下不能以下划线作为CSS中类名的前缀的BUG(feedback:Steve.Wei)。 -添加定时器控件Timer,...
多人聊天+用户在线 21个目标文件 摘要:JAVA源码,媒体网络,山寨QQ,Java聊天程序 Java编写的山寨QQ,多人聊天+用户在线,程序分服务端和客户端,典型C/S结构, 当用户发送第一次请求的时候,验证用户登录,创建一个该...
多人聊天+用户在线 21个目标文件 摘要:JAVA源码,媒体网络,山寨QQ,Java聊天程序 Java编写的山寨QQ,多人聊天+用户在线,程序分服务端和客户端,典型C/S结构, 当用户发送第一次请求的时候,验证用户登录,创建一个该...
系统主要运用在:主要运用于系统的表单验证比如登录注册验证码以及一些需要不刷新页面的异步提交页面(在车票查询,登录注册表单验证页面使用到了,还有是一些删除操作也使用到了) 前端页面使用的jsp(Java服务端...
在.NET访问MySql数据库时的几点经验! 自动代码生成器 关于能自定义格式的、支持多语言的、支持多数据库的代码生成器的想法 发布Oracle存储过程包c#代码生成工具(CodeRobot) New Folder XCodeFactory3.0完全攻略--...
如登录/注册页面,当用户输入邮箱地址时,可以自动判断邮箱是否已注册。如已注册可以直接输入密码登录;如没注册,自动显示密码确认输入框,用户可以输入两次密码直接注册; ⑷ 单一登录验证,同一用户不能同时在多处登录,...
表单类用于验证用户提交的数据,并将其转换为模型实例。 > > - manage.py:此文件是Django项目的命令行工具。您可以使用它来运行服务器,创建数据库迁移,运行测试等等。 ## 项目部署与运行 **准备工作** 项目...