jQuery.validationEngine前端验证

引入相关文件:

<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="[email protected]" 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"/>
时间: 2024-10-29 09:44:29

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

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

<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="Generator" content="EditPlus®"> <meta name="Author" content=""> <meta name="

jquery 的前端验证控件应用(form www.sysoft.cc)

jquery validate验证控件真是挺 好用,功能不错,找好文档,使用也较方便呵,不错. <html xmlns="http://www.w3.org/1999/xhtml" > <head runat="server"> <title>Index</title> <script src="../../Scripts/jquery-1.4.1.js" type="text/ja

jquery validationEngine ajax验证优化

验证input,先验证ajax外的规则(删除data-validation-engine中的ajax规则),验证之后自己写ajax来验证,最后再恢复原来的规则 function validateAjax(input,isValidate){     var $input = $(input), engine = $input.attr("data-validation-engine");     //验证除ajax外的其他规则     if(isValidate) {         

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

做前端时一般都习惯用JavaScript进行表单的简单验证比如非空验证和正则表达式验证,这样过滤后的数据提交到服务端再由专门的控制器做数据处理,这样能减轻服务器的负担,下面看一下前端验证的简单步骤: 首先举一个简单的表单作为例子: 1 <form action="query.php" name="form1" method="get" target="_blank"> 2 <label>请输入要查询的内

表单验证(ASP.NET+jquery.validationEngine.js)

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Login.aspx.cs" Inherits="Login" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"><head runat="server">

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

上篇文章写了简单的前端验证由传统的JavaScript转向流畅的jQuery滑动验证,现在拓展一下,使用Ajax实现用户体验比较好的异步查询,同样还是从建立一个简单的表单开始 1 <form name="form2"> 2 <label class="style1">请输入要查询的内容:</label> 3 <br /> 4 <br /> 5 <input name="neirong&quo

简单的jQuery前端验证码校验

简单的jQuery前端验证码校验2 html; <!DOCTYPE html> <html lang="zh-cn"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="width=device-widt

validationEngine 自定义验证

前端HTML,JQ <!DOCTYPE html> <head> <meta http-equiv="X-UA-Compatible" content="IE=7; IE=8; IE=9; IE=10" /> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <!--jquery--

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=&