动网论坛,站长建站首选,国内使用量最多的论坛软件 动网论坛官方技术讨论区 站长工具 申请属于您自己的免费论坛
首页 | 新闻资讯 | 网站运营 | 网络编程 | 数据库 | 服务器 | 网页设计 | 图像媒体 | 网络应用 | 搜索优化 | 资源下载 | 动网主机 | DVBOX
    本站内  互联网 ASP论坛  ASP.Net论坛  PHP论坛
  
   Jsp → 阅读文章

 用JSP在客户端生成JavaScript代码来实现表单校验

作者来源: 
阅读 数 423 人次 , 2006-3-29 4:23:00 


今天费了一天时间就是做这个东西,原理很简单,就是用 jsp 在页面的开始部分生成一段代码,
如 errorcheck.jsp 中所示,但程序太长,还是费了我不少时间来改写。

主程序是名为 errorcheck.java ,有了这个 errorcheck 的 bean,我们就再也不用为了表单校验去
写那一大堆烦人的 javascript 代码了。errorcheck 类已帮我们生成了几乎所有你将会用到的校验方法,
如是否为数字,长度的校验,是否为合法email等,你只需在 jsp 页面里调用相应的函数就可以了。

目前一共有七个函数:

一 检测是否为数字
//输入输入框名和错误提示信息
numericcheck(string inputname,string errormsg);

二 检测email是否合法
//输入输入框名和错误提示信息
emailcheck(string inputname,string errormsg);

三 检测电话号码是否合法
//输入输入框名和错误提示信息
telcheck(string inputname,string errormsg);

四 检测字串长度是否在规定范围那内
//输入输入框名,错误提示信息,最小长度,最大长度
lengthcheck(string inputname,string errormsg,int min,int max);

五 检测字串中是否不含禁止的字串
//输入输入框名,错误提示信息,禁止字串
denystrcheck(string inputname,string errormsg,string str);

六 检测字串中是否含给定字串
//输入输入框名,错误提示信息,指定字串
stringcheck(string inputname,string errormsg,string str);

七 检测日期格式是否为 "yyyy-mm-dd"
//输入输入框名和错误提示信息
datecheck(string inputname,string errormsg);

只要调用一下这个bean,然后用setfromname()设定你的表单名,再调用以上函数,
最后 out.println(yourid.errorcheckscript()),就输出了一段 javascript 代码了,当然了,
别忘了这个 <form name=myform onsubmit="return errorcheck();">

ok,just enjoy it,今天太累,不想多少,有任何意见请写信给我或在我主页上留言。

注:我调试 errorcheck.jsp 的时候因服务器的问题不知为何不能用 usebean,setproperty 的方法,
只好 new 了一下,我想你们是应该可以用usebean和setproperty的,自己改一下吧。

===================================== errorcheck.jsp =====================================

<%@ page language="java" import="dbclass.*" %>
<%@ page contenttype="text/html; charset=gb2312" %>
<jsp:usebean id="cc" scope="page" class="dbclass.errorcheck" />

<%
errorcheck ec = new errorcheck();
ec.setformname("myform");
ec.numericcheck("number","the number you input is invalid!");
ec.emailcheck("email","the email you input is invalid!");
ec.telcheck("tel","the telephone you input is invalid!");
ec.lengthcheck("strlen","the string you input in the fourth field in not between 6-8",6,8);
ec.denystrcheck("nojeru","the fifith field must not contain 'jeru'","jeru");
ec.stringcheck("jeru","the sixth field must not null and contian 'jeru'","jeru");
ec.datecheck("date","the date you input is invalid,should be yyyy-mm-dd");
out.println(ec.errorcheckscript());
%>

<html>
<body style="font-size:9pt; font-family:arial;">
<h1>errocheck test</h1>
<hr>
<form name=myform onsubmit="return errorcheck();">

input a number:<br>
<input type="text" name="number"><p>

input a emial:<br>
<input type="text" name="email"><p>

input a telephone:<br>
<input type="text" name="tel"><p>

input a string (length should between 6-8):<br>
<input type="text" name="strlen"><p>

input a string (shoulde not contain "jeru"):<br>
<input type="text" name="nojeru"><p>

input a string (must contain "jeru"):<br>
<input type="text" name="jeru"><p>

input a date (yyyy-mm-dd):<br>
<input type="text" name="date"><p>

<br><input type="submit" name="submit" value="go">
</form>
</body>
</html>

===================================== errorcheck.java =====================================

package dbclass;
/**
* errorcheck v 1.0
*
* 这个类是用来在客户端生成 javascript 代码来校验表单的
* 原是版本是同事 macro 用 php 写的,我感觉十分好用,再也
* 不用再为那些表单区写烦人的 javascript 代码拉,感谢他!
* 这次我用 java 改写,封装成一个类,并修复了少许的 bug,加
* 多了一条校验的功能,它的扩展性很好,以后可能会继续完善。
*
* mender :
*  jeru liu
* homepage :
*  http://www.cyberlabs.com/~jeru/
* email: jeru@163.net
*
*/

import java.io.*;

public class errorcheck {

/* public: the javascript string */
string errorcheckstr;

/* public: the form name you used */
public string formname;

public void setformname(string formname) {
 this.formname = formname;
}

/***************************************************************************\
* public: constructor functions
* 构造函数
\***************************************************************************/
public errorcheck() {
 this.errorcheckstr =
 "<script id=clienteventhandlersjs language=javascript>" + "\n" +
 "<!--" + "\n";
 this.neededfunction(); // load the needed functions
 this.errorcheckstr +=
 "function errorcheck() {" + "\n";
}

/***************************************************************************\
 * public: export javascript script
 * 输出 javascript 脚本
\***************************************************************************/
public string errorcheckscript() {
this.errorcheckstr +=
"}" + "\n" +
"-->" + "\n" +
"</script>" + "\n";
return this.errorcheckstr;
}

/***************************************************************************\
 * public: check the numeric
 * 检查录入框值是否是数字
\***************************************************************************/
public void numericcheck(string inputname, string errormsg) {
this.errorcheckstr +=
" if(fucchecknum(document."+formname+"."+inputname+".value) == 0) {" + "\n" +
" alert(\""+errormsg+".\");" + "\n" +
" document."+formname+"."+inputname+".focus();" + "\n" +
" return(false);" + "\n" +
" }" + "\n\n";
}

/***************************************************************************\
 * public: check the length
 * 检查录入框值的长度
\***************************************************************************/
public void lengthcheck(string inputname, string errormsg, int minlength, int maxlength) {
this.errorcheckstr +=
" if(fucchecklength(document."+formname+"."+inputname+".value)<"+minlength+" || " + "\n" +
" fucchecklength(document."+formname+"."+inputname+".value)>"+maxlength+") {" + "\n" +
" alert(\""+errormsg+".\");" + "\n" +
" document."+formname+"."+inputname+".focus();" + "\n" +
" return(false);" + "\n" +
" }" + "\n\n";
}

/***************************************************************************\
 * public: check the email
 * 检查录入框值是否是正确的email格式
\***************************************************************************/
public void emailcheck(string inputname, string errormsg) {
this.errorcheckstr +=
" if(chkemail(document."+formname+"."+inputname+".value) == 0) {" + "\n" +
" alert(\""+errormsg+".\");" + "\n" +
" document."+formname+"."+inputname+".focus();" + "\n" +
" return(false);" + "\n" +
" }" + "\n\n";
}

/***************************************************************************\
 * public: check the telephone number
 * 检查录入框值是否是电话号码
\***************************************************************************/
public void telcheck(string inputname, string errormsg) {
this.errorcheckstr +=
" if(fucchecktel(document."+formname+"."+inputname+".value) == 0) {" + "\n" +
" alert(\""+errormsg+".\");" + "\n" +
" document."+formname+"."+inputname+".focus();" + "\n" +
" return(false);" + "\n" +
" }" + "\n\n";
}

/***************************************************************************\
 * public: check if the input value contian the prefered string
 * 检查录入框值是否是包含给定字串
\***************************************************************************/
public void stringcheck(string inputname, string errormsg, string string) {
this.errorcheckstr +=
" if(document."+formname+"."+inputname+".value.indexof(\""+string+"\") != 0) {" + "\n" +
" alert(\""+errormsg+".\");" + "\n" +
" document."+formname+"."+inputname+".focus();" + "\n" +
" return(false);" + "\n" +
" }" + "\n\n";
}

/***************************************************************************\
 * public: check if the input value contain the denyed string
 * 检查录入框值是否是包含给禁止的字串
\***************************************************************************/
public void denystrcheck(string inputname, string errormsg, string string) {
this.errorcheckstr +=
" if (document."+formname+"."+inputname+".value.length == 0 || " + "\n" +
" document."+formname+"."+inputname+".value.indexof(\""+string+"\") != -1) {" + "\n" +
" alert(\""+errormsg+".\");" + "\n" +
" document."+formname+"."+inputname+".focus();" + "\n" +
" return(false);" + "\n" +
" }" + "\n\n";
}

/***************************************************************************\
 * public: check the yyyy-mm-dd format date
 * 检查录入框值是否是yyyy-mm-dd的日期格式
\***************************************************************************/
public void datecheck(string inputname, string errormsg) {
this.errorcheckstr +=
" if(chkdate(document."+formname+"."+inputname+".value) == 0) {" + "\n" +
" alert(\""+errormsg+".\");" + "\n" +
" document."+formname+"."+inputname+".focus();" + "\n" +
" return(false);" + "\n" +
" }" + "\n\n";
}


public void neededfunction() {
this.errorcheckstr +=  
"//函数名:fucchecknum" + "\n" +
"//功能介绍:检查是否为数字" + "\n" +
"//参数说明:要检查的数字" + "\n" +
"//返回值:1为是数字,0为不是数字" + "\n" +
"function fucchecknum(num) {" + "\n" +
" var i,j,strtemp;" + "\n" +
" strtemp=\"0123456789\";" + "\n" +
" if ( num.length == 0) return 0;" + "\n" +
" for (i=0;i<num.length;i++) {" + "\n" +
" j = strtemp.indexof(num.charat(i));" + "\n" +
" if (j==-1) {" + "\n" +
" //说明有字符不是数字" + "\n" +
" return 0;" + "\n" +
" }" + "\n" +
" }" + "\n" +
" //说明是数字" + "\n" +
" return 1;" + "\n" +
"}" + "\n\n" +

"//函数名:fucchecklength" + "\n" +
"//功能介绍:检查字符串的长度" + "\n" +
"//参数说明:要检查的字符串" + "\n" +
"//返回值:长度值" + "\n" +
"function fucchecklength(strtemp) {" + "\n" +
" var i,sum;" + "\n" +
" sum=0;" + "\n" +
" for(i=0;i<strtemp.length;i++) {" + "\n" +
" if ((strtemp.charcodeat(i)>=0) && (strtemp.charcodeat(i)<=255))" + "\n" +
" sum=sum+1;" + "\n" +
" else" + "\n" +
" sum=sum+2;" + "\n" +
" }" + "\n" +
" return sum;" + "\n" +
"}" + "\n\n" +

"//函数名:chkemail" + "\n" +
"//功能介绍:检查是否为email address" + "\n" +
"//参数说明:要检查的字符串" + "\n" +
"//返回值:0:不是 1:是" + "\n" +
"function chkemail(a) {" + "\n" +
" var i=a.length;" + "\n" +
" var temp = a.indexof('@');" + "\n" +
" var tempd = a.indexof('.');" + "\n" +
" if (temp > 1) {" + "\n" +
" if ((i-temp) > 3) {" + "\n" +
" if (tempd!=-1) {" + "\n" +
" return 1;" + "\n" +
" }" + "\n" +
" }" + "\n" +
" }" + "\n" +
" return 0;" + "\n" +
"}" + "\n\n" +

"//函数名:fucchecktel" + "\n" +
"//功能介绍:检查是否为电话号码" + "\n" +
"//参数说明:要检查的字符串" + "\n" +
"//返回值:1为是合法,0为不合法" + "\n" +
"function fucchecktel(tel) {" + "\n" +
" var i,j,strtemp;" + "\n" +
" strtemp=\"0123456789-()#\";" + "\n" +
" if (tel.length == 0) return 0;" + "\n" +
" for (i=0;i<tel.length;i++) {" + "\n" +
" j=strtemp.indexof(tel.charat(i));" + "\n" +
" if (j==-1) {" + "\n" +
" //说明有字符不合法" + "\n" +
" return 0;" + "\n" +
" }" + "\n" +
" }" + "\n" +
" //说明合法" + "\n" +
" return 1;" + "\n" +
"}" + "\n\n" +

"//函数名:chkdate (yyyy-mm-dd)" + "\n" +
"//功能介绍:检查是否为日期" + "\n" +
"//参数说明:要检查的字符串" + "\n" +
"//返回值:0:不是日期 1:是日期" + "\n" +
"function chkdate(datestr) {" + "\n" +
" var lthdatestr" + "\n" +
" if (datestr != \"\")" + "\n" +
" lthdatestr= datestr.length ;" + "\n" +
" else" + "\n" +
" lthdatestr=0;" + "\n" +
" var tmpy=\"\";" + "\n" +
" var tmpm=\"\";" + "\n" +
" var tmpd=\"\";" + "\n" +
" //var datestr;" + "\n" +
" var status;" + "\n" +
" status=0;" + "\n" +
" if ( lthdatestr== 0)" + "\n" +
" return 0;" + "\n" +
" for (i=0;i<lthdatestr;i++) {" + "\n" +
" if (datestr.charat(i)== '-') {" + "\n" +
" status++;" + "\n" +
" }" + "\n" +
" if (status>2) {" + "\n" +
" return 0;" + "\n" +
" }" + "\n" +
" if ((status==0) && (datestr.charat(i)!='-')) {" + "\n" +
" tmpy=tmpy+datestr.charat(i)" + "\n" +
" }" + "\n" +
" if ((status==1) && (datestr.charat(i)!='-')) {" + "\n" +
" tmpm=tmpm+datestr.charat(i)" + "\n" +
" }" + "\n" +
" if ((status==2) && (datestr.charat(i)!='-')) {" + "\n" +
" tmpd=tmpd+datestr.charat(i)" + "\n" +
" }" + "\n" +
" }" + "\n" +
" year=new string (tmpy);" + "\n" +
" month=new string (tmpm);" + "\n" +
" day=new string (tmpd)" + "\n" +
" if ((tmpy.length!=4) || (tmpm.length>2) || (tmpd.length>2)) {" + "\n" +
" return 0;" + "\n" +
" }" + "\n" +
" if (!((1<=month) && (12>=month) && (31>=day) && (1<=day)) ) {" + "\n" +
" return 0;" + "\n" +
" }" + "\n" +
" if (!((year % 4)==0) && (month==2) && (day==29)) {" + "\n" +
" return 0;" + "\n" +
" }" + "\n" +
" if ((month<=7) && ((month % 2)==0) && (day>=31)) {" + "\n" +
" return 0;" + "\n" +
" }" + "\n" +
" if ((month>=8) && ((month % 2)==1) && (day>=31)) {" + "\n" +
" return 0;" + "\n" +
" }" + "\n" +
" if ((month==2) && (day==30)) {" + "\n" +
" return 0;" + "\n" +
" }" + "\n" +
" return 1;" + "\n" +
"}" + "\n\n";

}

/*public static void main(string[] args) {
errorcheck ec = new errorcheck("testfrom");
string script = ec.errorcheckscript();
system.out.println(script);
} */

}

 本文Tags组网  
 收藏本文  打印本文  论坛讨论  关闭窗口
· 上一篇:浏览器关闭cookie情况下进行会话管理
· 下一篇:在JSP页面中实现检索数据的分页显示
· JSP中的TagLib应用(4-2)
· JAVA/JSP学习系列之十
· 应用JDOM处理数据库到XML转换的JSP实现 (一)
· 一个连接池的例子 (一)
· JSP/Servlet的重定向技术综述


关于本站 | 联系我们 | 业务合作 | 客户案例 | 诚聘英才 | 广告合作 | 收藏本站
海口动网先锋网络科技有限公司版权所有
Copyright © 2000 - 2006 Cndw.Com
中华人民共和国电信与信息服务业务经营许可证编号 琼 ICP 020077