引入相关文件:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.js" type="text/
javascript"></script>
<script src="js/jquery.validationEngine-en.js" type="text/javascript" charset="utf-8"></script>
<script src="js/jquery.validationEngine.js" type="text/javascript" charset="utf-8"></script>
<link rel="stylesheet" href="css/validationEngine.jquery.css" type="text/css"/>

使用实例:

邮箱验证:
<input value="someone@nowhere.com" class="validate[required,custom[email]]" type="text" name="email" id="email" />
日期验证:
<input value="2010-12-01" class="validate[required,custom[date]]" type="text" name="date" id="date" />
数字验证:
<input value="too many spaces obviously" class="validate[required,custom[onlyLetterNumber]]" type="text" name="special" id="special" />
URL验证:
<input value="http://" class="validate[required,custom[url]] text-input" type="text" name="url" id="url" data-prompt-position="topLeft" />
必填验证:
<input value="" class="validate[required] text-input" type="text" name="req" id="req" data-prompt-position="bottomLeft" />
数字字母验证:
<input value="too many spaces obviously" class="validate[required,custom[onlyLetterNumber]]" type="text" name="special" id="special" data-prompt-position="bottomRight" />
自定义验证:
<input value="" class="validate[required,funcCall[checkHELLO]]" type="text" id="lastname" name="lastname" />
function checkHELLO(){
alert('Hello World!');
}
AJAX验证:
<input value="" class="validate[required,custom[onlyLetterNumber],maxSize[20],ajax[ajaxUserCall]] text-input" type="text" name="user" id="user" />
"ajaxUserCall": {
"url": "ajaxValidateFieldUser",
"extraData": "name=eric",
"extraDataDynamic": ['#user_id', '#user_email'],
"alertText": "* This user is already taken",
"alertTextOk": "All good!",
"alertTextLoad": "* Validating, please wait"
},
多选验证:
<input class="validate[minCheckbox[2]]" type="checkbox" name="group1" id="maxcheck1" value="5"/>
<input class="validate[minCheckbox[2]]" type="checkbox" name="group1" id="maxcheck2" value="3"/>
<input class="validate[minCheckbox[2]]" type="checkbox" name="group1" id="maxcheck3" value="9"/>

jQuery.validationEngine前端验证的更多相关文章

  1. Jquery ValidationEngine 修改验证提示框的位置

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. 使用 jQuery 进行前端验证

    前段验证脚本的教程,其基础为jQuery的插件validate.    一.可以验证哪些信息 要求输入不能为空 要求输入格式必须为电子邮箱 要求输入格式必须为URL 要求输入格式必须为日期 要求输入格 ...

  3. 使用 jQuery 进行前端验证 -- 1

    如今很多的网站偶会有不同层次的验证去验证用户输入的信息是否符合我们所需要的数据类型.并且可以说任何有输入的地方都需要的去验证,验证一方面是要求用户输入正确格式的数据,同时也是避免恶意的用户进行非法的输 ...

  4. jQuery Validate前端验证

    我们经常看到如下效果,那么它是如何实现的呢?看下面: 废话少说,直接上代码,大家直接Copy就能看到上面的效果啦. <html> <head> <title>验证内 ...

  5. jquery前端验证框架

    1.validationEngine.jquery.css  样式包 2.jquery.validationEngine-zh_CN.js 中文语言包 3.jquery.validationEngin ...

  6. 关于引入多个jquery冲突的问题(附一个很好用的validate前端验证框架及使用方法)

    废话不多说,进入正题: 如果一个jsp中想要使用两个不同版本的jquery怎么办呢?客官往下看: <script src="${ctxStatic}/jquery/jquery-1.8 ...

  7. jQuery结合Ajax实现简单的前端验证和服务端查询

    上篇文章写了简单的前端验证由传统的JavaScript转向流畅的jQuery滑动验证,现在拓展一下,使用Ajax实现用户体验比较好的异步查询,同样还是从建立一个简单的表单开始 <form nam ...

  8. Javascript配合jQuery实现流畅的前端验证

    做前端时一般都习惯用JavaScript进行表单的简单验证比如非空验证和正则表达式验证,这样过滤后的数据提交到服务端再由专门的控制器做数据处理,这样能减轻服务器的负担,下面看一下前端验证的简单步骤: ...

  9. 简单的jQuery前端验证码校验

    简单的jQuery前端验证码校验2 html; <!DOCTYPE html> <html lang="zh-cn"> <head> <m ...

随机推荐

  1. iOS的Ping++支付接入步骤(详细)

    Ping++ SDK 代码下载地址: https://github.com/CoderLeezhen/PingppDemo 参考链接: https://www.pingxx.com/guidance/ ...

  2. api (三)文本字符输出 (转)

    在使用Win32编程时,我们常常要输出文本到窗口上,Windows所有的文本字符或者图形输出都是通过图形设备接口(GDI)进行的,Windows的三大核心组件之一的GDI32.dll封装了所有的文本和 ...

  3. Spring-----Assert断言工具类

    转载自:http://blog.csdn.net/hekewangzi/article/details/51956577

  4. Linux学习之find命令

    find是我们很常用的一个Linux命令,但是我们一般查找出来的并不仅仅是看看而已,还会有进一步的操作,这个时候exec的作用就显现出来了. exec解释: -exec  参数后面跟的是command ...

  5. mysql sql学习(一)mysql连接

    mysql -h 192.168.3.103 -uroot -p123456 //连接数据库 \s :查看数据库状态 show databases; 查看是数据库 create database if ...

  6. 在eclipse上安装 Marketplace Client

    Eclipse Marketplace是个插件应用商店,很实用的一个功能. 打开 eclipse,help--Eclipse Marketplace Client就能找到 有的eclipse中没有这个 ...

  7. Extjs springmvc session 超时 处理

    如果你的项目使用ExtJS作为表现层,你会发现,SESSION超时控制将是一个问题.本文将就自己的经验,来解决这一问题,当然,解决问题并非只有一种方法,我只是提出我的方法.首先,做超时控制,必需使用过 ...

  8. 编译SASS

    编译SASS sass编译有很多种方式,如命令行编译模式.sublime插件SASS-Build.编译软件koala.前端自动化软件codekit.Grunt打造前端自动化工作流grunt-sass. ...

  9. High Context とLow Context文化

    社会の様々な文化を分類するのに.Low context culture, High context cultureという分け方がある.ビジネススクールのグローバル・マーケティングの授業などでよく取り上 ...

  10. 【servlet3.0新特性】Annotation注解配置

    servlet3.0新特性Servlet3.0引入的若干重要新特性,包括异步处理.新增的注解支持.可插性支持等等,为读者顺利向新版本过渡扫清障碍.Servlet3.0新特性概述Servlet3.0作为 ...