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. 常见的HTTP相应状态码

    200:请求被正常处理204:请求被受理但没有资源可以返回206:客户端只是请求资源的一部分,服务器只对请求的部分资源执行GET方法,相应报文中通过Content-Range指定范围的资源.301:永 ...

  2. MFC中调用Windows API函数的方式

    windows aoi 函数的调用前面加::

  3. 获取汉字的拼音首字母--pinyin

    var pinyin = (function (){ var Pinyin = function (ops){ this.initialize(ops); }, options = { checkPo ...

  4. 二、spring中装配bean

    在spring框架中提供了三种 bean的装配方式,当然这三种装配方式是可以灵活的进行组合使用的,项目中使用最多的是自动装配bean的方式,也就是通过注解的方式进行bean的装配,一下是四种装配方式的 ...

  5. ORACLE中的游标Cursor总结

    游标(Cursor):用来查询数据库,获取记录集合(结果集)的指针,可以让开发者一次访问一行结果集,在每条结果集上作操作. 游标可分为: 1.       静态游标:分为显式(explicit)游标和 ...

  6. sql分组和连接

    SELECT mr.member_id, mr.username, GROUP_CONCAT(DISTINCT jb.company,jb.start_time,jb.end_time)company ...

  7. String与常量池(JDK1.8)

    ---- 基础知识 String是final类, 并且其方法都被final修饰 String通过char数组来保存字符串 对String对象的任何操作都不会影响到原来的String对象, 所有的改变都 ...

  8. Runlevel in Linux

    运行级别(Runlevel)指的是Unix或者Linux等类Unix操作系统下不同的运行模式.运行级别通常分为7等,分别是从0到6,但如果必要的话也可以更多. 例如在大多数Linux操作系统下一共有如 ...

  9. windows事件查看器

    如果一个软件发生异常,软件本身没有提示异常信息, 需要从事件查看器中查看产生的错误事件 运行输入eventvwr或者win + X

  10. 原生JS版和jQuery 版实现文件上传功能

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