由于嵌套的div，jQuery验证错误没有显示？

我试图用Validate插件使用jQuery，除了我不能让我的错误出现。以下是我正在使用的代码。我已经阅读了文档，并且无法确定是因为.validate配置不正确，还是因为我的错误与css布局的几个div内有关。在此先感谢您的帮助。由于嵌套的div，jQuery验证错误没有显示？

<script type="text/javascript"> 
$(document).ready(function() { 
    $("#order_form").validate({ 
     debug:true, 
     errorContainer: "#errors", 
     errorLabelContainer: "#errors ul", 
     wrapper:"li", 
     onsubmit:true, 
     rules: { 
      business_name: { 
      required: true 
     } 

    }, 
    messages: { 
     business_name: { 
      required: "Please enter a valid business name or select &quot;Individual&quot; from above" 
     } 
    } 
}); 

}); 
</script> 
</head> 
<body> 

<div id="wrapper"> 
<div id="logo"> 
    <img src="images/RPP7.png" />  
</div> 
<div id="menu"> 
    <ul> 
     <li class="current_page_item"><a href="index.html">Home</a></li> 
     <li><a href="about.html">About</a></li> 
     <li><a href="videos.html">Videos</a></li> 
     <li><a href="services.html">Services</a></li> 
     <li><a href="contact.html">Contact</a></li> 
    </ul> 
</div> 
<div id="content"> 
    <div class="post"> 
     <h2 class="title">Order Now</h2> 
     <div class="entry"> 
      <font size="-1">Note: This page is viewed correctly with Javascript enabled.</font> 
      <div id="errors"> 
<p>One or more things went wrong:</p 
    <ul></ul> 
</div> 
      <form id="orderForm" method="get" action=""> 
        <label for="t_business"><input type="radio" name="business" value="business" id="t_business" />Business</label> 
       <label for="t_individual"><input type="radio" name="indiv" value="indiv" id="t_individual" />Individual</label><br /> 
       <div id="business"> 
        <label for="business_name">Business Name: </label><br /><input type="text" name="business_name" /><br /> 
       </div> 

       <label for="f_name">First Name: *</label><br /><input type="text" id="f_name" /><br /> 
       <label for="l_name">Last Name: *</label><br /><input type="text" id="l_name" /><br /><br /> 
       <label>Preferred Method of Contact: *</label> 
       <label for="p_phone"><input type="radio" name="contact" id="p_phone" />Phone</label> 
       <label for="p_email"><input type="radio" name="contact" id="p_email" />E-Mail</label><br /> 
       <div id="contact_phone"> 
        <label for="phone_nr">Phone Number: </label><br /><input type="text" name="phone_nr" /><br /> 
       </div> 
       <div id="contact_email"> 
        <label for="email_add">E-mail Address: </label><br /><input type="text" name="email_add" /><br /> 
       </div> 
       <br /> 
       <label>Project Type: </label><br /> 
        <label for="v_school"><input type="radio" name="project" id="v_school" />School Project</label><br /> 
        <label for="v_business"><input type="radio" name="project" id="v_business" />Business Video</label><br /> 
        <label for="v_personal"><input type="radio" name="project" id="v_personal" />Personal Video</label><br /> 
        <label for="v_collection"><input type="radio" name="project" id="v_collection" />Photo Collection</label><br /> 
        <label for="v_other"><input type="radio" name="project" id="v_other" />Other...</label><br /> 
       <div id="v_other_info"> 
        <label>Please Specify: </label><br /> 
        <input type="text" name="v_other_info" /> 
       </div> 
       <label>Additional Information: </label><br /> 
       <textarea rows="5" cols="30" name="add_info"></textarea><br /> 
       <input class="submit" type="submit" value="Submit" /> 
      </form> 
     </div> 
    </div> 
</div>

来源

2012-02-08 randomkid88

您的选择是错误的。

$("#order_form").validate({ ... });

应该是：

$("#orderForm").validate({ ... });

事实上，如果你打开调试器（萤火虫或类似的），你会看到以下消息：

没有什么选择，可以” t验证，不返回

来源

2012-02-08 02:55:23

* facepalm *哇。这就是我一次改变太多东西的结果。谢谢。第二双眼睛总是有帮助的。 – randomkid88 2012-02-08 02:57:47

@ randomkid88：哈哈，没问题。我也注意到一些'输入'缺少'name'属性，这也会对验证造成严重破坏。 – 2012-02-08 02:59:27

由于嵌套的div，jQuery验证错误没有显示？

回答

相关问题