jquery.validate自己定义验证--成功提示与择要提示
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自己定义验证--成功提示与择要提示的更多相关文章
- jQuery Validate 表单验证
在做网页表单时时常需要在客户端对表单填写的数据进行验证一番才能提交,我们可以通过自己编写JavasScript代码来验证,但是有时数据量过多时就会有些难度了.基于jQuery的jquery.valid ...
- (转)[jQuery]使用jQuery.Validate进行客户端验证(初级篇)——不使用微软验证控件的理由
以前在做项目的时候就有个很大心病,就是微软的验证控件,虽然微软的验证控件可以帮我们完成大部分的验证,验证也很可靠上手也很容易,但是我就是觉得不爽,主要理由有以下几点: 1.拖控件太麻烦,这个是微软控件 ...
- (转)jQuery Validate 表单验证
在做网页表单时时常需要在客户端对表单填写的数据进行验证一番才能提交,我们可以通过自己编写JavasScript代码来验证,但是有时数据量过多时就会有些难度了.基于jQuery的jquery.valid ...
- [jQuery]使用jQuery.Validate进行客户端验证(初级篇)
以前在做项目的时候就有个很大心病,就是微软的验证控件,虽然微软的验证控件可以帮我们完成大部分的验证,验证也很可靠上手也很容易,但是我就是觉得不爽,主要理由有以下几点: 1.拖控件太麻烦,这个是微软控件 ...
- ASP.NET MVC Jquery Validate 表单验证的多种方式
在我们日常开发过程中,前端的表单验证很重要,如果这块处理不当,会出现很多bug .但是如果处理的好,不仅bug会很少,用户体验也会得到很大的提升.在开发过程中我们可以不借助 JS 库,自己去手写 JS ...
- aspx中的表单验证 jquery.validate.js 的使用 以及 jquery.validate相关扩展验证(Jquery表单提交验证插件)
这一期我们先讲在aspx中使用 jquery.validate插件进行表单的验证, 关于MVC中使用 validate我们在下一期中再讲 上面是效果,下面来说使用步骤 jQuery.Valid ...
- [转]ASP.NET MVC Jquery Validate 表单验证的多种方式介绍
在我们日常开发过程中,前端的表单验证很重要,如果这块处理不当,会出现很多bug .但是如果处理的好,不仅bug会很少,用户体验也会得到很大的提升.在开发过程中我们可以不借助 JS 库,自己去手写 JS ...
- Jquery Validate 表单验证的多种方式
ASP.NET MVC Jquery Validate 表单验证的多种方式 在我们日常开发过程中,前端的表单验证很重要,如果这块处理不当,会出现很多bug .但是如果处理的好,不仅bug会很少,用户体 ...
- Jquery Validate 正则表达式实用验证代码
jQuery.validate 的正则验证功能,包括手机号码.电话号码.邮政编码.QQ号码.IP地址.字母和数字.中文的验证等. 手机号码验证 以下为引用内容: jQuery.validator.a ...
随机推荐
- 【HTML5】可以省略标记的元素
- expdp dblink
客户端创建dblik create public database link [link_name] connect to {username} identified by "{passwo ...
- PyQt5实现第一个桌面应用程序
import sysfrom PyQt5.QtWidgets import QApplication,QWidget,QDialogfrom PyQt5.QtCore import Qt if __n ...
- redis中基本命令
记录一下redis中的基本命令.redis中有redis-cli工具客户端,使用这个客户端来发送一些命令 一.redis-cli的使用 1.redis-cli使用之发送命令 2.redis-cli使 ...
- Centos6.5下 执行“ll”提示“-bash: ll: command not found”
ll 是 ls -l的别名,之所所以 ll出现错误是因为没有定义别名. 如果要实现ll 命令,可以做如下操作: 编辑 ~./bashrc 添加 ls -l 的别名为 ll即可 [root@Centos ...
- ubuntu14.04 mysql-workbench Connecting to MySQL server ... Native table 'performance_schema'.'session_variables' has the wrong structure错误解决
使用的mysql版本: mysql Ver 14.14 Distrib 5.7.9, for Linux (x86_64) using EditLine wrapper 打开shell命令 1.输 ...
- Mac使用Aria2下载百度网盘,突破下载限速的方法教程
百度网盘目前可以说是在国内网盘环境中一枝独秀,日常使用触及在所难免,尤其是对于喜欢下载资源的朋友来说,但是一些限制让它的使用越来越难,尤其是下载速度,普通用户的下载往往远低于自己的预期,特别是对于 M ...
- uva 1592 Database (STL)
题意: 给出n行m列共n*m个字符串,问有没有在不同行r1,r2,有不同列c1,c2相同.即(r1,c1) = (r2,c1);(r1,c2) = (r2,c2); 如 2 3 123,456,789 ...
- git-github 提示Permission denied (publickey) (windows)
这种绝大多数情况是由于公钥设置的问题. 1.生成公钥 参考地址:https://help.github.com/articles/generating-a-new-ssh-key-and-adding ...
- python之字符串处理 2014-4-5
#字符串 p62 13:20pm-15:20 上一章讲的所有的序列化操作对于字符串同样适用 不过字符串不可变 所以无法使用分片赋值 1.字符串格式化 >>> format=" ...