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验证 - 表单成功消失

回答

相关问题