jQuery   发布时间:2022-04-19  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了你如何强制jQuery Validate在表单元素内部而不是外部显示错误?大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
以jQuery Validate的这个基本示例为例(请参阅下面的链接),如何在可能的情况下指示它在表单元素中显示错误消息(显然复选框不起作用)?

http://docs.jquery.com/Plugins/validation#source

解决方法

显然你会想要为自己的形式定制它,但绝对定位可能会帮助你.对于您引用的示例:

[截断]加价:

<form class="cmxform" id="commentForm" method="get" action="">
 <fieldset>
   <legend>A simple comment form with submit validation and default messages</legend>
   <p>
     <label for="cname">Name</label>
     <em>*</em><input id="cname" name="name" size="25" class="required" minlength="2" />
   </p>
 </fieldset>
</form>

CSS:

.cmxform p{position:relative;}
.cmxform label.error{position:absolute; left: 11.7em; top:5px; display:block; width:180px; /*Computed width of text input was 189px*/ overflow:hidden;}

当然,这种方法确实有一个主要缺点,那就是错误标签将悬挂在用户输入的内容之上(和之上).在jquery.com的例子中,当我输入时,我的名字的第一个字母上有一个红色的“请输入至少2个字符”的消息.要解决这个问题,你需要做这样的事情:

$(document).ready(function(){
  $('.cmxform input[type=text]').focus(function(){
    $(this).siblings('.error').hide(); // Hide the error while the user is typing
  }).blur(function(){
    if( !$('#commentForm').validate().element(this) ){ // Re-validate this element,show the label if still invalid
      $(this).siblings('.error').show();
    }
  });
});

大佬总结

以上是大佬教程为你收集整理的你如何强制jQuery Validate在表单元素内部而不是外部显示错误?全部内容,希望文章能够帮你解决你如何强制jQuery Validate在表单元素内部而不是外部显示错误?所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。