jquery validationEngine的使用
1.引入文件
<script src="/js/jquery-1.4.2.min.js" type="text/javascript"></script>
<script src="/js/jqueryInline1.7/jquery.validationEngine-cn.js" type="text/javascript"></script>
<script src="/js/jqueryInline1.7/jquery.validationEngine.js" type="text/javascript"></script>
<link rel="stylesheet" href="/js/jqueryInline1.7/validationEngine.jquery.css" type="text/css" media="screen" title="no title" charset="utf-8" />
<link rel="stylesheet" href="/js/jqueryInline1.7/template.css" type="text/css" media="screen" title="no title" charset="utf-8" />
2.启动
//验证
$("#form1").validationEngine(); //提交
$("#submit").click(function(){
$("#form1").submit();
});
3.为元素添加验证
添加一个
<input name="name" type="text" class="validate[required] input1 ml10" value="<!--{$aData.name}-->">
添加多个
<input id="time" name="time" type="text" class="validate[required,custom[date]] input1 ml10 mh_date" value="<!--{$aData.time}-->">
添加自定义
function validate2fields(){
if($("#firstname").val() =="" || $("#lastname").val() == ""){
return false;
}else{
return true;
}
}
"validate2fields":{
"nname":"validate2fields",
"alertText":"* 你必须有姓和名"}
<input value="" class="validate[required,custom[onlyLetter],funcCall[validate2fields],length[0,100]] text-input" type="text" id="lastname" name="lastname" />
4.效果
下面看看,提示语的代码
(function($) {
$.fn.validationEngineLanguage = function() {};
$.validationEngineLanguage = {
newLang: function() {
$.validationEngineLanguage.allRules = {"required":{ // Add your regex rules here, you can take telephone as an example
"regex":"none",
"alertText":"* 必选字段",
"alertTextCheckboxMultiple":"* 请选择选项",
"alertTextCheckboxe":"* 需要这个复选框"},
"length":{
"regex":"none",
"alertText":"*在 ",
"alertText2":" 和 ",
"alertText3": " 之间"},
"maxCheckbox":{
"regex":"none",
"alertText":"* 检查允许超过"},
"minCheckbox":{
"regex":"none",
"alertText":"* 请选择 ",
"alertText2":" 选项"},
"confirm":{
"regex":"none",
"alertText":"* 你的字段不匹配"},
"telephone":{
"regex":"/^[0-9\-\(\)\ ]+$/",
"alertText":"* 无效的号码"},
"email":{
"regex":"/^[a-zA-Z0-9_\.\-]+\@([a-zA-Z0-9\-]+\.)+[a-zA-Z0-9]{2,4}$/",
"alertText":"* 无效的邮箱"},
"date":{
"regex":"/^[0-9]{4}\-\[0-9]{1,2}\-\[0-9]{1,2}$/",
"alertText":"* 无效的日期,必须是YYYY-MM-DD的格式"},
"onlyNumber":{
"regex":"/^[0-9\ ]+$/",
"alertText":"* 只允许输入数字"},
"noSpecialCaracters":{
"regex":"/^[0-9a-zA-Z]+$/",
"alertText":"* 有非法字符"},
"ajaxUser":{
"file":"validateUser.php",
"extraData":"name=eric",
"alertTextOk":"* 这个用户是合法的",
"alertTextLoad":"* 加载中,请等待",
"alertText":"* 这个用户已经存在"},
"ajaxName":{
"file":"validateUser.php",
"alertText":"* 这个名字已经被使用",
"alertTextOk":"* 这个名字是可以的",
"alertTextLoad":"* 加载中,请等待"},
"onlyLetter":{
"regex":"/^[a-zA-Z\ \']+$/",
"alertText":"* 只允许输入字母"},
"validate2fields":{
"nname":"validate2fields",
"alertText":"* 你必须有姓和名"}
} }
}
})(jQuery); $(document).ready(function() {
$.validationEngineLanguage.newLang()
});
还有一些ajax的调用,继续探讨。
jquery validationEngine的使用的更多相关文章
- jQuery.validationEngine.js学习
项目中使用到了这个插件,抽了个空,看了一下. (function($){ var method ={} $.fn.validationEngine = function(){} $.validatio ...
- jQuery.validationEngine前端验证
引入相关文件: <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.js" type ...
- jquery.validationEngine
引入库文件 <!DOCTYPE html> <head> <!--jQuery--> <script type="text/javascript&q ...
- Jquery ValidationEngine 修改验证提示框的位置
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- jquery validationEngine 使用ajax验证不通过也提交表单
转自 http://mylfd.iteye.com/blog/2007227 validationEngine给我们为前端的表单验证减少了很大的工作量.大部分情况我们使用validationEngin ...
- jQuery Validation Engine 表单验证
功能强大的 jQuery 表单验证插件,适用于日常的 E-mail.电话号码.网址等验证及 Ajax 验证,除自身拥有丰富的验证规则外,还可以添加自定义的验证规则. 兼容 IE 6+, Chrome, ...
- 验证控件jQuery Validation Engine简单自定义正则表达式
首先上控件的地址http://code.ciaoca.com/jquery/validation-engine/ 具体使用方式网站里说的很清楚,我写这篇文章主要是用于记录如何自己添加自定义正则表达式, ...
- jQuery 表单验证插件 jQuery Validation Engine 使用
jQuery 表单验证插件 jQuery Validation Engine 使用方式如下: 1.引入头文件(注意一定要把jQuery放在前面),指定使用 jQuery Validation Engi ...
- jquery validation ajax 验证
<link href="${base}/res/basic/css/jquery/validationEngine/validationEngine.jquery.css" ...
随机推荐
- C# WEB API ApiController 修改response header contentType
var res = Request.CreateResponse(HttpStatusCode.OK, file); res.Content.Headers.ContentType = new Med ...
- ios 导航栏和旋屏
1,状态栏(UIStatusBar) http://my.oschina.net/shede333/blog/304560 2,visibleViewController和topViewControl ...
- hdu 5335 Walk Out(bfs+寻找路径)
Problem Description In an n∗m maze, the right-bottom corner or a written on it. An explorer gets los ...
- Lua Table 操作
Lua中table类似与C#种的字典,其实就是一个key-value键值对数据结构.来学习下table基本操作 Table的创建 myTable = {} --表名后面使用{}赋值,表示一个空的表 m ...
- qt反走样(简选)
# -*- coding: utf-8 -*- # python:2.x __author__ = 'Administrator' #qt反走样(简选) #概念 """ ...
- Linux查看系统信息
系统 # uname -a # 查看内核/操作系统/CPU信息 # head -n 1 /etc/issue # 查看操作系统版本 # cat /proc/cpuinfo # 查看CPU信息 # ho ...
- JUnit4基础 使用JUnit4进行单元测试
JUnit 4全面引入了Annotation来执行我们编写的测试. 关于JUnit 3的使用可以参见:http://www.cnblogs.com/mengdd/archive/2013/03/26/ ...
- J2EE之普通类载入web资源文件的方法
在WEB中普通类并不能像Servlet那样通过this.getServletContext().getResourceAsStream()获取web资源,须要通过类载入器载入,这里有两种方式,这两种方 ...
- iocomp控件的应用
iocomp是一个强大的工业控件.适用于vb/vc/vs.net/Delphi/BCB(windows/linux).囊括了常见的工业控制控件,详见官网说明,源码能够到官网下载,也能够到我的资源库下载 ...
- Winform开发之窗体传值
Winform的窗体之间的数据传递是开发的必备技术,下面介绍几种典型的传值方法 1.构造函数传值,但这种方法是单向的(推荐) 上代码,先传值 private void button2_Click(ob ...