日期:2014-05-16 浏览次数:20412 次
本文说的是在登录页面中使用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) {