jQuery验证 - 隐藏错误信息

问题描述:

我正在使用jQuery验证插件,并希望禁用它创建的或元素/容器以显示错误“消息”。jQuery验证 - 隐藏错误信息

基本上,我希望带有错误的输入元素具有错误类,但不要创建包含错误消息的附加元素。

这可能吗?

我刚刚想到了一个CSS解决方法,但它没有真正解决这个问题,该元素仍在创建?

<style> 
label.simpleValidationError {display: none !important; } 
</style> 
+1

jQuery的只是本身不显示或创建任何类型的错误消息,你将不得不多一点点进入细节你正在使用来实现这一目标 – Hannes 2011-01-06 12:04:14

+1

对不起你在做什么,什么,我是使用jQuery验证插件:http://bassistance.de/jquery-plugins/jquery-plugin-validation/ – Sjwdavies 2011-01-06 12:07:59

+0

〜这还不是很多额外的信息,但它确实澄清了一些事情。当你创建验证器时,你在做什么(明智的选择)以及你如何处理它给你的数据? – jcolebrand 2011-01-06 14:19:42

您可以设置showErrors选项仅执行元件突出功能:

$("selector").validate({ 
    showErrors: function() { 
     if (this.settings.highlight) { 
      for (var i = 0; this.errorList[i]; ++i) { 
       this.settings.highlight.call(this, this.errorList[i].element, 
        this.settings.errorClass, this.settings.validClass); 
      } 
     } 
     if (this.settings.unhighlight) { 
      for (var i = 0, elements = this.validElements(); elements[i]; ++i) { 
       this.settings.unhighlight.call(this, elements[i], 
        this.settings.errorClass, this.settings.validClass); 
      } 
     } 
    } 
}); 

这在很大程度上依赖于验证插件的内部,虽然如此,它可能不是安全的。最好的方法是让插件以与defaultShowErrors()相同的方式公开defaultHighlightElements()方法,但事实并非如此。

使用一个空函数验证errorPlacement选项:

$("selector").validate({ errorPlacement: function(error, element) {} }); 

这实际上无处放置的错误消息。

您也可以使用此代码:

jQuery.validator.messages.required = ""; 

$("selector").validate(); 

我也有同样的问题。我不想要错误消息,只是需要注意的表单输入的亮点。 这些消息都已经空像<?php $msj='""';?>但仍创造了错误的元素/标签后的容器..

于是迅速制止这种事情发生我注释掉其中规定label.insertAfter(element);唯一的线编辑的jquery.validate.js文件在线697 +/- ..

这只是一个noob的解决方法;)但它做到了!

我也想隐藏错误信息,并将我的input字段和textarea变成红色,错误。 这里有一个小例子:

http://jsfiddle.net/MFRYm/51/

和充分的工作代码的情况下的jsfiddle断裂;)

<!DOCTYPE html> 
<html> 
<head> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
    <title> Demo</title> 

    <script type='text/javascript' src='http://code.jquery.com/jquery-1.10.1.js'></script>  

     <script type='text/javascript' src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.15.0/jquery.validate.js"></script> 


    <style type='text/css'> 
    .error { 
    border: 1px solid red; 
} 
    </style> 

<script type='text/javascript'>//<![CDATA[ 
$(window).load(function(){ 
$("#email_form").validate({ 
     rules: { 
     email: { 
      required: true, 
      email: true 
     } 
     }, highlight: function(input) { 
      $(input).addClass('error'); 
     }, 
    errorPlacement: function(error, element){} 
}); 
});//]]> 

</script> 


</head> 
<body> 
<form name="form" id="email_form" method="post" action="#"> 
    <div class="item" style="clear:left;"> 
     <label>E Mail *</label> 
     <input id="femail" name="email" type="text"> 
    </div> 
    Type invalid email and press Tab key 
</form> 

</body> 

</html> 

由于我使用的CSS样式的label.valid,label.error在JQuery验证,这个按钮清除了所有的错误,并且保留了表单域中的数据。

 <button onclick="$('label.error').css('display', 'none');return false;">Clear Error </button> 

仅适用于CSS

最简单的办法:

label.valid { 
    display: none; 
} 

可能是一个更简单和语义最好的解决办法是使用CSS

需要
label.error { 
    position:absolute; 
    left:20000px; 
    top:0; 
    } 
input.error { 
    border:red 1px; 
} 

没有JS,更易于管理和某人屏幕阅读器实际上会有一些迹象表明他们错过了某些东西

我有一个由另一个验证库开发的项目,我想添加验证库以使用其功能来检查表单是否有效(使用验证库不具备该功能)

我的solvo是: 我只是说验证库通过其CDN

和使用验证功能上点击:

$(document).on('click','#buttonID',function(){ 
    var form = $("#formID"); 
    form.validate(); 
    console.log(form.valid()); 
}); 

,并试图通过添加CSS代码隐藏的错误消息,通过JQuery验证提出:

label.error{ 
    display: none!important; 
} 

您可以添加一个onfocus和一个可以删除错误消息的onkeyup。

$("selector").validate({ 
    onkeyup: false, 
    onfocusout: false 
});