jQuery validationEngine校验表单格式

http://code.ciaoca.com/jquery/validation_engine/

jquery validate engine一共包含三个文件:

jquery.validationEngine.js,主文件,必须包含到页面中

jquery.validationEngine-zh_CN.js,中文语言包,为我们提供中文的错误提示

validationEngine.jquery.css,样式文件,所有的提示的样式都写在这个css文件中。

另外还一个文件:

validationEngine.jquery-blue.css,这个是我们自己修改的一个蓝色的提示样式文件。默认的样式文件的提示是红色的。

3、文件包含

<link href="js/validationEngine/validationEngine.jquery-blue.css" rel="stylesheet" type="text/css" />

<script src="js/jquery/jquery.min.js" charset="utf-8"></script>

<script src="js/validationEngine/jquery.validationEngine.js" charset="utf-8"></script>

<script src="js/validationEngine/jquery.validationEngine-zh_CN.js" charset="utf-8"></script>

一定要包含一个jquery,不然这个组件没法儿用。当时,如果其它地方包含了jQuery,这里就要再重复包含了。

也可以使用cdn提供:http://www.bootcdn.cn/jQuery-Validation-Engine/

包含如下地址:

<link href="//cdn.bootcss.com/jQuery-Validation-Engine/2.6.4/validationEngine.jquery.min.css" rel="stylesheet">

<script src="//cdn.bootcss.com/jQuery-Validation-Engine/2.6.4/jquery-1.8.2.min.js"></script>

<script src="//cdn.bootcss.com/jQuery-Validation-Engine/2.6.4/languages/jquery.validationEngine-zh_CN.min.js"></script>

<script src="//cdn.bootcss.com/jQuery-Validation-Engine/2.6.4/jquery.validationEngine.min.js"></script>

4、表单调用说明

1)表单<form>标签中加一个onsubmit事件    

onsubmit="return jQuery(this).validationEngine('validate');"

2)表单控件中加入校验的class

<input type="text" name="email" class="validate[required,custom[email]]">

上面要求邮箱必填,且必须是email格式

做了上面的操作,插件就会自动的提交表单时进行校验操作了,非常方便。

03-14 16:35