2011-01-06 80 views
27

我正在使用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

回答

5

您可以設置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()方法,但事實並非如此。

69

使用一個空函數驗證errorPlacement選項:

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

這實際上無處放置的錯誤消息。

5

您也可以使用此代碼:

jQuery.validator.messages.required = ""; 

$("selector").validate(); 
2

我也有同樣的問題。我不想要錯誤消息,只是需要注意的表單輸入的亮點。 這些消息都已經空像<?php $msj='""';?>但仍創造了錯誤的元素/標籤後的容器..

於是迅速制止這種事情發生我註釋掉其中規定label.insertAfter(element);唯一的線編輯的jquery.validate.js文件在線697 +/- ..

這只是一個noob的解決方法;)但它做到了!

3

我也想隱藏錯誤信息,並將我的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> 
2

由於我使用的CSS樣式的label.valid,label.error在JQuery驗證,這個按鈕清除了所有的錯誤,並且保留了表單域中的數據。

 <button onclick="$('label.error').css('display', 'none');return false;">Clear Error </button> 
0
僅適用於CSS

最簡單的辦法:

label.valid { 
    display: none; 
} 
1

可能是一個更簡單和語義最好的解決辦法是使用CSS

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

沒有JS,更易於管理和某人屏幕閱讀器實際上會有一些跡象表明他們錯過了某些東西

1

我有一個由另一個驗證庫開發的項目,我想添加驗證庫以使用其功能來檢查表單是否有效(使用驗證庫不具備該功能)

我的solvo是: 我只是說驗證庫通過其CDN

和使用驗證功能上點擊:

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

,並試圖通過添加CSS代碼隱藏的錯誤消息,通過JQuery驗證提出:

label.error{ 
    display: none!important; 
} 
0

您可以添加一個onfocus和一個可以刪除錯誤消息的onkeyup。

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