在登录页面中js开展正则验证电话号码和邮箱地址，并使用ajax进行用户ID的数据库验证
日期：2014-05-16 浏览次数：20525 次
在登录页面中js进行正则验证电话号码和邮箱地址，并使用ajax进行用户ID的数据库验证
本文说的是在登录页面中使用js进行正则验证并使用ajax进行用户ID的数据库验证，另外也加入键盘监听。
先看一下登录的jsp页面代码
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ page import="org.ml.drp.sysmgr.domain.*"%>
<%@ page import="org.ml.drp.sysmgr.manager.*" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
String command = request.getParameter("command");
if("addUser".equals(command)){
if(UserManager.getInstance().findUserById(request.getParameter("userId"))!=null){
out.write("<font color=red>用户"+request.getParameter("userId")+"已经存在</font>");
}else{
User user = new User();
user.setUserId(request.getParameter("userId"));
user.setUserName(request.getParameter("userName"));
user.setPassword(request.getParameter("password"));
user.setContactTel(request.getParameter("contactTel"));
user.setEmail(request.getParameter("email"));
if(UserManager.getInstance().addUser(user)){
out.write("<font color=red>用户信息添加成功</font>");
}else{
out.write("<font color=red>添加用户过程中出现异常</font>");
}
}
}
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>添加用户</title>
<link rel="stylesheet" href="../style/drp.css">
<script src="../script/client_validate.js"></script>
<script type="text/javascript">
function goBack() {
window.self.location="user_maint.html";
}
function addUser() {
//验证用户代码
var userId = document.getElementById("userId");
var userIdValue = userId.value;
if(!(/^[a-zA-Z]+[a-zA-Z0-9]*$/.test(trim(userIdValue))&&/^[a-zA-Z0-9]{4,6}$/.test(trim(userIdValue)))){
alert("用户代码必须以字母开头,并且为4-6位！");
userId.focus();
userId.select();
return;
}
/*
if(trim(userIdValue)==""){
alert("用户代码不能为空 ！");
userId.focus();
userId.select();
return;
}
if(trim(userIdValue).length<4){
alert("用户代码至少为4位！");
userId.focus();
userId.select();
return;
}
*/
//验证用户名
var userName = document.getElementById("userName");
var userNameValue = userName.value;
if(trim(userNameValue)==""){
alert("用户名不能为空 ！");
userName.focus();
userName.select();
return;
}
//验证密码
var password = document.getElementById("password");
var passwordValue = password.value;
if(trim(passwordValue)==""){
alert("密码不能为空 ！");
password.focus();
password.select();
return;
}
if(trim(passwordValue).length<6){
alert("用户密码至少6位！");
password.focus();
password.select();
return;
}
//验证电话
var contactTel = document.getElementById("contactTel");
var contactTelValue = contactTel.value;
if(trim(contactTelValue)!=""){
var pattern=/^(13[0-9]|15[0-9]|18[8|9])\d{8}$/;
var flag = pattern.test(contactTelValue);
if(!flag){
alert("联系电话格式不正确！");
contactTel.focus();
return;
}
}
//验证邮箱
var email = document.getElementById("email");
var emailValue = email.value;
if(trim(emailValue)!=""){
var pattern1 = /^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/;
var flag = pattern1.test(emailValue);
if(!flag)
{
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
