在被验证的控件的后一个元素控制显示
errorPlacement: function(error, element) {
element.next().css("color","red");
if(error.text() == ''){
element.next().html("ok");
} else {
element.next().html(error.text());
}
},
 
 
 
errorElement : 'span',
errorPlacement: function(error, element) {  
   error.appendTo(element.parent());  
},
success: function(label) {
        label.addClass("valid")
   },

 
    
    // 中文验证
$.validator.addMethod("stringCheck", function(value, element) {
return this.optional(element) || /^[\u0391-\uFFE5\w]+$/.test(value);
}, "只能包括中文字、英文字母、数字和下划线");
 
// 只能中文
$.validator.addMethod("CNonly", function(value, element) {
return this.optional(element) || /^[\u4e00-\u9fa5]+$/.test(value);
}, "只能输入汉字");
 
 

one(type, [data], fn)

概述

为每一个匹配元素的特定事件（像click）绑定一个一次性的事件处理函数。

在每个对象上，这个事件处理函数只会被执行一次。其他规则与bind()函数相同。这个事件处理函数会接收到一个事件对象，可以通过它来阻止（浏览器）默认的行为。如果既想取消默认的行为，又想阻止事件起泡，这个事件处理函数必须返回false

可以使用jq 自带的属性改变错误的显示的位置,其中element是验证未通过的当前表单元素,error为错误后的提示信息
$("#subscribeForm").validate({

errorPlacement : function(error, element) {

if (element.is(":radio"))

error.appendTo(element.parent());

else if (element.is(":checkbox"))

error.appendTo(element.parent().parent());

else

error.appendTo(element.parent().next());

}

rules : {username:required : true,maxlength : 20}

});

使用jq为我们自带的属性可以在不"破解原界面的情况下"方便的统一修改，希望我的回答能给你带来帮助！

 

jQuery验证框架（一） 可选项 (jQuery validation)

jQuery验证框架

  1. <script type="text/javascript" src=js/jquery-1.3.2.min.js></script>
  2. <script type="text/javascript" src=js/jquery.validate.pack.js></script>
  3. <script type="text/javascript">
  4. $(document).ready(function(){
  5. $("#textForm").validate();
  6. });
  7. </script>
  8. <form class="cmxform" id="commentForm" method="get" action="">
  9. Name<input id="cname" name="name" size="25" class="required" minlength="2" />
  10. <input class="submit" type="submit" value="Submit"/>
  11. </form>

此文谨以以上js片段开始介绍jQuery Validation。
验证从这个方法开始：validate( [options] )
一、可选项( options )
[1]  debug      类型：Boolean    默认：false
      说明：开启调试模式。如果为true，表单不会提交，而且会在控制台显示一些错误消息（需要Firebug或者Firebug lite）。当要阻止表单默认提交事件，尝试去开启它。

  1. $(".selector").validate({
  2. debug: true
  3. })

[2]  submitHandler      类型：Callback    默认：default (native) form submit
      说明：当表单通过验证，提交表单。回调函数有个默认参数form

  1. $(".selector").validate({
  2. submitHandler: function(form) {
  3. // do other stuff for a valid form
  4. form.submit();
  5. }
  6. })

[3]  invalidHandler      类型：Callback
      说明：当未通过验证的表单提交时，可以在该回调函数中处理一些事情。该回调函数有两个参数：第一个为一个事件对象，第二个为验证器（validator）

  1. $(".selector").validate({
  2. invalidHandler: function(form, validator) {
  3. var errors = validator.numberOfInvalids();
  4. if (errors) {
  5. var message = errors == 1
  6. ? 'You missed 1 field. It has been highlighted'
  7. : 'You missed ' + errors + ' fields. They have been highlighted';
  8. $("div.error span").html(message);
  9. $("div.error").show();
  10. } else {
  11. $("div.error").hide();
  12. }
  13. }
  14. })

[4]  ignore      类型：Seletor
      说明：当进行表单验证时，过滤掉选择器所选择的表单。用了jQuery not方法（ not() ）。类型为submit和reset的表单总是被忽略的。

  1. $("#myform").validate({
  2. ignore: ".ignore"
  3. })

[5]  rules      类型：Options    默认：rules are read from markup (classes, attributes, metadata)
      说明：用
户定义的键/值对规则。键为一个表单元素的
name属性（或是一组单选/复选按钮）、值为一个简单的字符串或者由规则/参数对（rule/parameter）组成的一个对象。可以和
class/attribute/metadata 规则一起使用。每个规则可以指定一个依存的验证前提条件。

  1. $(".selector").validate({
  2. rules: {
  3. // simple rule, converted to {required:true}
  4. name: "required",
  5. // compound rule
  6. email: {
  7. required: true,
  8. email: true
  9. }/*
  10. email: {
  11. depends: function(element) {
  12. return $("#contactform_email:checked")
  13. }
  14. }*/
  15. }
  16. })

[6]  messages      类型：Options    默认：验证方法默认使用的消息
      说明：用
户自定义的 键/值
对消息。键为一个表单元素的name属性，值为该表单元素将要显示的消息。该消息覆盖元素的title属性或者默认消息。消息可以是一个字符串或者一个回

调函数。回调函数必须在验证器的作用域中调用，将规则参数作为回调函数的第一个参数，将该表单元素作为回调函数的第二个参数，且必须返回一个字符串类型的
消息。

  1. $(".selector").validate({
  2. rules: {
  3. name: "required",
  4. email: {
  5. required: true,
  6. email: true
  7. }
  8. },
  9. messages: {
  10. name: "Please specify your name",
  11. email: {
  12. required: "We need your email address to contact you",
  13. email: "Your email address must be in the format of name@domain.com"
  14. }
  15. }
  16. })

[7]  groups      类型：Options
      说明：指定错误消息分组。一个组由一个任意的组名作为键，一个由空白符分割的表单元素name属性列表作为值。用errorPlacement定义组消息的存放位置。

  1. $("#myform").validate({
  2. groups: {
  3. username: "fname lname"
  4. },
  5. errorPlacement: function(error, element) {
  6. if (element.attr("name") == "fname"
  7. || element.attr("name") == "lname" )
  8. error.insertAfter("#lastname");
  9. else
  10. error.insertAfter(element);
  11. },
  12. debug:true
  13. })

[8]  onsubmit      类型：Boolean    默认：true
      说明：提交时验证表单。当设置为false时，只能用其它的事件验证。

  1. $(".selector").validate({
  2. onsubmit: false
  3. })

[9]  onfocusout      类型：Boolean    默认：true
      说明：焦点离开时验证（单选/复选按钮除外）。如果表单中没有输入任何内容，所有的规则将被跳过，除非该表单已经被标记为无效的。

  1. $(".selector").validate({
  2. onfocusout: false
  3. })

[10]  onkeyup      类型：Boolean    默认：true
      说明：当键盘按键弹起时验证。只要表单元素没有被标记成无效的，不会有反应。另外，所有的规则将在每次按键弹起时验证。

  1. $(".selector").validate({
  2. onkeyup: false
  3. })

[11]  onclick      类型：Boolean    默认：true
      说明：鼠标点击验证针对单选和复选按钮。

  1. $(".selector").validate({
  2. onclick: false
  3. })

[12]  focusInvalid      类型：Boolean    默认：true
      说明：当验证无效时，焦点跳到第一个无效的表单元素。当为false时，验证无效时，没有焦点响应。

  1. $(".selector").validate({
  2. focusInvalid: false
  3. })

[12]  focusCleanup      类型：Boolean    默认：false
      说明：如果为true，当表单得到焦点时，移除在该表单上的errorClass并隐藏所有错误消息。避免与focusInvalid一起使用。

  1. $(".selector").validate({
  2. focusCleanup: true
  3. })

[13]  meta      类型：String
      说明：如果想使用其它插件来使用元数据验证规则，得指定相应的元数据对象。

  1. $("#myform").validate({
  2. meta: "validate"
  3. })
  4. <input type="text" name="email" class="{validate:{ required: true, email:true}}" />

[14]  errorClass      类型：String    默认："error"
      说明：用此设定的样式来定义错误消息的样式。

  1. $(".selector").validate({
  2. errorClass: "invalid"
  3. })

[15]  validClass      类型：String    默认："valid"
      说明：设定当验证通过时，消息显示的样式。

  1. $(".selector").validate({
  2. validClass: "success"
  3. })

[16]  errorElement      类型：String    默认："label"
      说明：用html元素类型创建错误消息的容器。默认的"label"有个优点就是能在错误消息与无效表单之间用for属性建立有意义的联系（一个常常使用的，而不管表单元素是什么的）。

  1. $(".selector").validate({
  2. errorElement: "em"
  3. })

[17]  wrapper      类型：Boolean
      说明：用一个指定的元素将错误消息包围。与errorLabelContainer一起创建一个错误消息列表非常有用。

  1. $(".selector").validate({
  2. wrapper: "li"
  3. })

[18]  errorLabelContainer      类型：Selector
      说明：错误消息标签的容器。

  1. $("#myform").validate({
  2. errorLabelContainer: "#messageBox",
  3. wrapper: "li"
  4. })

[19]  errorContainer      类型：Selector
      说明：错误消息的容器。

  1. $("#myform").validate({
  2. errorContainer: "#messageBox1, #messageBox2",
  3. errorLabelContainer: "#messageBox1 ul",
  4. wrapper: "li", debug:true,
  5. submitHandler: function() { alert("Submitted!") }
  6. })

[20]  showErrors      类型：Callback    默认：None,内置的显示消息
      说明：自
定义消息显示的句柄。该回调函数有两个参数，第一
个为errorMap,第二个参数为errorList，在validator对象的上下文中调用。参数只包含那些经过onblur/onkeyup验证
的表单元素，也有可能是单个元素。除此之外，你还可以用this.defaultShowErrors()触发默认的行为。

  1. $(".selector").validate({
  2. showErrors: function(errorMap, errorList) {
  3. $("#summary").html("Your form contains "
  4. + this.numberOfInvalids()
  5. + " errors, see details below.");
  6. this.defaultShowErrors();
  7. }
  8. })

[21]  errorPlacement      类型：Callback    默认：紧跟在无效表单后的标签中
      说明：用户自定义错误标签的显示位置。第一个参数：一个作为jQuery对象的错误标签，第二个参数为：一个作为jQuery对象的未通过验证的表单元素。

  1. $("#myform").validate({
  2. errorPlacement: function(error, element) {
  3. error.appendTo( element.parent("td").next("td") );
  4. },
  5. debug:true
  6. })

[22]  success      类型：String,Callback
      说明：如果指定它，当验证通过时显示一个消息。如果是String类型的，则添加该样式到标签中，如果是一个回调函数，则将标签作为其唯一的参数。

  1. $("#myform").validate({
  2. //success: "valid",
  3. success: function(label) {
  4. label.addClass("valid").text("Ok!")
  5. }
  6. })

[23]  highlight      类型：Callback    默认：添加errorClass到表单元素
      说明：将未通过验证的表单元素设置高亮。

  1. $(".selector").validate({
  2. highlight: function(element, errorClass) {
  3. $(element).fadeOut(function() {
  4. $(element).fadeIn()
  5. })
  6. }
  7. })

[24]  unhighlight      类型：Callback    默认：移除errorClass
      说明：与highlight操作相反

  1. $(".selector").validate({
  2. highlight: function(element, errorClass) {
  3. $(element).addClass(errorClass);
  4. $(element.form).find("label[for=" + element.id + "]")
  5. .addClass(errorClass);
  6. },
  7. unhighlight: function(element, errorClass) {
  8. $(element).removeClass(errorClass);
  9. $(element.form).find("label[for=" + element.id + "]")
  10. .removeClass(errorClass);
  11. }
  12. });

[25]  ignoreTitle      类型：Boolean    默认：false
      说明：设置它用来跳过错误消息对title属性的引用，避免Google工具栏引起的冲突。

    1. $(".selector").validate({
    2. ignoreTitle: true
    3. })

最新文章

  1. Linux C 收藏
  2. Cordova环境搭建 &amp; HelloWorld
  3. 利用js刷新页面方法
  4. S5中新增的Array方法详细说明
  5. case when 对某个字段值分类讨论
  6. IOS 的loadView 及使用loadView中初始化View注意的问题。（死循环并不可怕）
  7. 一步步搭建自己的轻量级MVCphp框架-（二）一个国产轻量级框架Amysql源码分析（1）
  8. 项目中libevent几个问题
  9. read/write数据读写传输方式（转）
  10. 鸟哥的Linux私房菜 第十八章、认识系统服务 (daemons)
  11. Filter过滤器实现同一地址手机和电脑页面不同
  12. SQL SERVER2005 excel float导入
  13. 搭建mybatis时的小问题
  14. 前端知识点总结——VUE
  15. MySQL和SQLyog的配置-安装及遇到的问题
  16. 【linux】基础知识
  17. 服务器配置+wordpress建站（小白）
  18. js做的轮播图
  19. Git(查看修改记录)
  20. css预处理和bootstrap

热门文章

  1. Winform实现鼠标可穿透的窗体镂空效果
  2. UI1_UICollectionView
  3. php29号小结（隔行换色&#183;&#183;&#183;&#183;&#183;&#183;）
  4. springMvc(三)session、HandlerInterceptorAdapter
  5. CC2530之Flash映射
  6. 【MediaKit】WPF项目中 调用摄像头拍照的开发包
  7. NDK 通过java调用so文件
  8. matlab之图像处理（2）
  9. yaf运行错误：Class &#39;Yaf_Application&#39; not found
  10. Silverlight中弹出网页