jQuery驗證 - 表單成功消失

我有一個簡單的表單驗證使用jQuery驗證，我遇到了一個我從未見過的問題。我有一個包裝在使用驗證摘要進行驗證的容器中的表單，並且當您在其中一個驗證成功的字段中輸入了一些信息，然後切斷標籤，容器的全部內容就會消失。我認爲這與包裝物業配套的形式是在容器做你可以看到此行爲在下面的代碼片段/ jsFiddles：jQuery驗證 - 表單成功消失

$('#form1').validate({ 
     wrapper: 'p', 
     errorContainer: '#jserror', 
     errorClass: 'jserror', 
     errorLabelContainer: '#ValidationErrors', 
     highlight: function(element, errorClass) { 
      $(element).addClass('errorfields'); 
     }, 
     unhighlight: function(element, errorClass) { 
      $(element).removeClass('errorFields'); 
     }, 
     rules : {}, 
     messages: { 
      name: { 
       required: "Name is required" 
      }, 
      postSlug: { 
       postSlug: "Can only contain numbers, letters, dashes and underscores", 
       required: "Post slug is required" 
      } 
     } 
    });// end validate

表格和標題被包裹在UL /李和設置包裝時的內容完全消失：「禮」 http://jsfiddle.net/tjans/cqXXu/41/

表格和標題被包裹在DIV，並設置包裝時的內容完全消失：「格」 http://jsfiddle.net/tjans/cqXXu/44/

表格和標題被包裹在DIV ，包裝被設置爲'p'，一切正常。 http://jsfiddle.net/tjans/cqXXu/45/

這是一個錯誤，還是有一個解決方法/更好的語法來做到這一點？

來源

2013-04-23 tjans

「設置包裝器時消失」 - 僅在要求時才爲真 - 首先輸入無效的電子郵件地址以查看我的意思 – 2013-04-23 14:37:32

正確，僅在必填字段中... – tjans 2013-04-23 17:42:11

對於你的問題是，該插件也在你的errorLabelContainer的父母上設置display:none。

嘗試，而不是這樣......

HTML：

<div id="ValidationErrors" class="messageContainer validation" style="display:none;"> 
    <ul></ul> 
</div>

驗證選項：

errorLabelContainer: '#ValidationErrors ul',

DEMO：http://jsfiddle.net/uWVZ9/

這個與你的問題沒有關係，但我也刪除了空的rules: {} ......這從來不是一個好主意，它完全是多餘的，因爲你的規則已經與HTML內聯定義了。

來源

2013-04-23 14:52:00 Sparky

該死的滑雪板，就是這樣。我在其他代碼中看到了一些舊的例子，我總是在驗證錯誤方面有一個div，所以我現在從來沒有碰到過這個問題。感謝您的幫助... – tjans 2013-04-23 17:39:16

您也可以簡單地將ValidationErrors容器包裝在一個div中，而不是改變其他任何東西，它會實現相同的效果。 – tjans 2013-04-23 17:41:34

jQuery驗證 - 表單成功消失

回答

相關問題