1. 自己定义验证--成功提示



1) 加入选项

errorClass: "unchecked"。
validClass: "checked",
errorElement: "span",
errorPlacement: function (error, element) {
if (element.parent().find("span[for=""" + element.attr("id") + """]") != null) {
element.parent().find("span[for=""" + element.attr("id") + """]").remove();
}
error.appendTo(element.parent());
},
success: function (label) {
label.removeClass("unchecked").addClass("checked");
},

2)设置样式

input.unchecked{border: 1px #E6594E dotted;}
span.checked {
padding: 3px 5px 3px 21px;margin-left: 10px;margin-top: 0px;margin-bottom: 3px;adisplay: inline;
height: 25px;line-height: 1px;font-size: 12px;aborder: 1px solid #E6594E;white-space: nowrap;
text-align: left;color: #E6594E;background:url("/Common/Sys/Cfg/images/checked.gif") no-repeat 3px;/* #FCEAE8 */
}
span.unchecked {
padding: 3px 5px 3px 21px;margin-left: 10px;margin-top: 0px;margin-bottom: 3px;adisplay: inline;
height: 25px;line-height: 1px;font-size: 12px;border: 1px solid #E6594E;white-space: nowrap;
text-align: left;color: #E6594E;background: #FCEAE8 url("/Common/Sys/Cfg/images/unchecked.gif") no-repeat 3px;
}

2. 自己定义验证--择要提示



1) 加入选项

errorContainer: container,
errorLabelContainer: $("ul"。 container),
wrapper: ""li"",
meta: "validate",
errorClass: "unchecked",
validClass: "checked",

2) 设置样式

input.unchecked{border: 1px #E6594E dotted;}
span.checked {
padding: 3px 5px 3px 21px;margin-left: 10px;margin-top: 0px;margin-bottom: 3px;adisplay: inline;
height: 25px;line-height: 1px;font-size: 12px;aborder: 1px solid #E6594E;white-space: nowrap;
text-align: left;color: #E6594E;background:url("/Common/Sys/Cfg/images/checked.gif") no-repeat 3px;/* #FCEAE8 */
}
span.unchecked {
padding: 3px 5px 3px 21px;margin-left: 10px;margin-top: 0px;margin-bottom: 3px;adisplay: inline;
height: 25px;line-height: 1px;font-size: 12px;border: 1px solid #E6594E;white-space: nowrap;
text-align: left;color: #E6594E;background: #FCEAE8 url("/Common/Sys/Cfg/images/unchecked.gif") no-repeat 3px;
}
div.container {
background-color: #eee;
border: 1px solid red;
margin: 5px;
padding: 5px;
}
div.container ol li {
list-style-type: disc;
margin-left: 20px;
}
div.container { display: none }
.container label.error {
display: inline;
}

3) 加入择要标识表记标帜

<div class="container">
<h4>There are serious errors in your form submission, please see below for details.</h4>
<ul></ul>
</div>

jquery.validate自己定义验证--成功提示与择要提示的更多相关文章

  1. jQuery Validate 表单验证

    在做网页表单时时常需要在客户端对表单填写的数据进行验证一番才能提交,我们可以通过自己编写JavasScript代码来验证,但是有时数据量过多时就会有些难度了.基于jQuery的jquery.valid ...

  2. (转)[jQuery]使用jQuery.Validate进行客户端验证(初级篇)——不使用微软验证控件的理由

    以前在做项目的时候就有个很大心病,就是微软的验证控件,虽然微软的验证控件可以帮我们完成大部分的验证,验证也很可靠上手也很容易,但是我就是觉得不爽,主要理由有以下几点: 1.拖控件太麻烦,这个是微软控件 ...

  3. (转)jQuery Validate 表单验证

    在做网页表单时时常需要在客户端对表单填写的数据进行验证一番才能提交,我们可以通过自己编写JavasScript代码来验证,但是有时数据量过多时就会有些难度了.基于jQuery的jquery.valid ...

  4. [jQuery]使用jQuery.Validate进行客户端验证(初级篇)

    以前在做项目的时候就有个很大心病,就是微软的验证控件,虽然微软的验证控件可以帮我们完成大部分的验证,验证也很可靠上手也很容易,但是我就是觉得不爽,主要理由有以下几点: 1.拖控件太麻烦,这个是微软控件 ...

  5. ASP.NET MVC Jquery Validate 表单验证的多种方式

    在我们日常开发过程中,前端的表单验证很重要,如果这块处理不当,会出现很多bug .但是如果处理的好,不仅bug会很少,用户体验也会得到很大的提升.在开发过程中我们可以不借助 JS 库,自己去手写 JS ...

  6. aspx中的表单验证 jquery.validate.js 的使用 以及 jquery.validate相关扩展验证(Jquery表单提交验证插件)

    这一期我们先讲在aspx中使用 jquery.validate插件进行表单的验证, 关于MVC中使用 validate我们在下一期中再讲     上面是效果,下面来说使用步骤 jQuery.Valid ...

  7. [转]ASP.NET MVC Jquery Validate 表单验证的多种方式介绍

    在我们日常开发过程中,前端的表单验证很重要,如果这块处理不当,会出现很多bug .但是如果处理的好,不仅bug会很少,用户体验也会得到很大的提升.在开发过程中我们可以不借助 JS 库,自己去手写 JS ...

  8. Jquery Validate 表单验证的多种方式

    ASP.NET MVC Jquery Validate 表单验证的多种方式 在我们日常开发过程中,前端的表单验证很重要,如果这块处理不当,会出现很多bug .但是如果处理的好,不仅bug会很少,用户体 ...

  9. Jquery Validate 正则表达式实用验证代码

    jQuery.validate 的正则验证功能,包括手机号码.电话号码.邮政编码.QQ号码.IP地址.字母和数字.中文的验证等. 手机号码验证 以下为引用内容:  jQuery.validator.a ...

随机推荐

  1. MapReduce实例——查询缺失扑克牌

    问题: 解决: 首先分为两个过程,Map过程将<=10的牌去掉,然后只针对于>10的牌进行分类,Reduce过程,将Map传过来的键值对进行统计,然后计算出少于3张牌的的花色 1.代码 1 ...

  2. javascript事件委托和jquery事件委托

    元旦过后,新年第一篇. 初衷:很多的面试都会涉及到事件委托,前前后后也看过好多博文,写的都很不错,写的各有千秋,自己思前想后,为了以后自己的查看,也同时为现在找工作的前端小伙伴提供一个看似更全方位的解 ...

  3. python3.x Day6 多线程

    线程???进程????区别???何时使用??? 进程:是程序以一个整体的形式暴露给操作系统管理,里边包含了对各种资源的调用,内存的使用,对各种资源的管理的集合,这就叫进程 线程:是操作系统最小的调度单 ...

  4. 安装bitcore

    官网----------------------------------------------https://bitcore.io先安装好 node.js v4,  npmsudo npm inst ...

  5. linux下硬盘分区、格式化以及文件管理系统

    1.添加虚拟硬盘 (1)点击编辑虚拟机位置,然后点击添加   (2)点击添加硬盘 (3)点击下一步 (4)创建新虚拟磁盘并点击下一步 (5)指定磁盘容量并且点击下一步 (6)点击完成 2.系统分区 当 ...

  6. Unity3D 固定功能函数

    Unity 3D 测试固定功能函数执行顺序 1. 在GameObject和脚本激活状态下,测试: 2. 在GameObject激活状态下,测试: 3. 在2种情况都不激活的状态下测试:脚本无输出: 函 ...

  7. Spring之HelloWorld

    [Spring是什么?] 1.Spring是一个开源框架. 2.Spring为简化企业级应用开发而生,使用Spring可以使简单的JavaBean实现以前只有EJB(EJB是sun的JavaEE服务器 ...

  8. 九度教程第22题——今年暑假不AC(看尽量多的电视节目)

    #define _CRT_SECURE_NO_DEPRECATE #include <stdio.h> #include <algorithm> using namespace ...

  9. xtu summer individual 3 F - Opening Portals

    Opening Portals Time Limit: 2000ms Memory Limit: 262144KB This problem will be judged on CodeForces. ...

  10. 【状压+状态转移】A Famous Airport Managere

    https://www.bnuoj.com/v3/problem_show.php?pid=25653 [题意] 给定一个3*3的九宫格,模拟一个停机坪.第一个格子一定是'*',代表take off ...