JS验证框架的使用方法

今天着重介绍的是JS验证框架在Java Web项目中的应用，

JSValidation要去http://cosoft.org.cn/projects/jsvalidation中下载最新版本。

JSValidation可以实现的验证功能：

13种验证规则：
输入内容非空
输入数值必须为整数
输入数值必须为双精度浮点数
输入字符必须为普通英文字符（字母，数字，下划线）
输入字符必须为中文字符
输入的内容是否为Email格式
输入内容最大长度
输入内容最小长度
输入的内容是否为日期格式（yyyy-mm-dd）
自定义的正则表达式
输入数值的整数范围（大于某数而小于某数）
输入数值的双精度范围
输入内容必须与某个域的值相同。

这可以使我们联想到Struts中Validator插件的配置和使用，这个是验证插件。

不过我介绍的这个更好用一些。只需把三个文件移到Web-Root下，再在网页中加入两句关键的JavaScript语句就可以。

这三个文件是validation-config.dtd（关键文件，可能有关转码）、validation-framework.js、validation-config.xml。

其中validation-framework.js中的红色字体，这句是路径，如果三个文件放到Web-Root下就没必要修改。

/*
* JavaScript Validation Framework
*
* Author: Michael Chen(mechiland) on 2004/03
* This software is on the http://www.cosoft.org.cn/projects/jsvalidation
* for update, bugfix, etc, you can goto the homepage and submit your request
* and question.
* Apache License 2.0
* You should use this software under the terms.
*
* Please, please keep above words. At least ,please make a note that such as
* "This software developed by Michael Chen(http://www.jzchen.net)" .
* $Id: validation-framework.js,v 1.7 2004/04/30 05:33:29 jzchen Exp $
*/

/** Config Section, Config these fields to make this framework work. **/

// If there is only one config file in your system, use this property. otherwise, use
// ValidationFramework.init("configfile")
// instead.
var ValidationRoot = "";

// the field style when validation fails. it aim to provide more beautiful UI and more good
// experience to the end-user.
// NOTE: this will be buggy. Please report the error to me.
var ValidationFailCssStyle = "border:2px solid #FFCC88;";

//Validation function. The entry point of the framework.
function doValidate(formRef) {

。。。。。。

validation-config.xml中的代码，

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE validation-config SYSTEM "validation-config.dtd">
<validation-config lang="auto">
<form id="form1" show-error="alert" show-type="all">
  <field name="username" display-name="用户名" onfail="">
   <depend name="required" />
   <depend name="commonChar" />
  </field>
  <field name="password" display-name="密码">
   <depend name="required" />
   <depend name="commonChar" />
  </field>
</form>
</validation-config>

页面里

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<meta http-equiv="Content-Language" content="zh-cn">
<title>JavaScript Validation Framework</title>
<link rel="stylesheet" type="text/css" href="style.css">
<script language="JavaScript" src="validation-framework.js"></script>
<SCRIPT LANGUAGE="JavaScript" src="site.js"></SCRIPT>
</head>

红色部分要着重注意。

好了配置完成！

施杨出品！！！

posted on 2008-07-26 17:01 俱正Steven 阅读(5086) 评论(6) 编辑收藏举报

刷新页面返回顶部

Steven 's Think out

JS验证框架的使用方法

导航