jquery - 使用 jQuery Validate 一次检查表单的各个部分

Question

我正在尝试弄清楚如何将 jquery validate 合并到我的调查表中。表单本身被分解为隐藏的部分 (div)，并使用 jquery 上下滑动。这样我就可以出于各种原因将一个大表格塞进一个页面中，并且仍然保持干净(大概)。问题是我无法弄清楚如何将 jquery 合并到表单中，以便在切换到下一部分之前我一次只验证部分或某些字段。

下面是一些非常基本的代码来说明表单

<script>
$(document).ready(function(){
    $(".go_section2").click(function(){
        // need to validate section 1 fields here or stop section jump
        $("#section2").slideDown("slow");
    });
    $(".go_section3").click(function(){
        // need to validate section 3 fields here or stop section jump
        $("#section3").slideDown("slow");
    });
    // etc...
});
</script>
<form name="theForm" id="theForm" class="theForm" method="POST" action="">
    <!-- Section 1 -->
    <div class="questionnaireHeader">Section 1 Header</div>
    <div id="section1" class="questionnaireSection">
        <label for="FirstName">First Name</label>
        <input id="FirstName" name="FirstName"/><br />
        <label for="LastName">Last Name</label>
        <input id="LastName" name="LastName"/><br />
        [form fields for section 1]<br />
        <span class="go_section2">next</span>
    </div>
    <!-- Section 2 -->
    <div class="questionnaireHeader">Section 2 Header</div>
    <div id="section2" class="questionnaireSection" style="display:none;">
        [form fields for section 2]
    </div>
    <!-- Section 3 thru x -->
</form>

因此，当用户在第 1 部分中单击“下一步”时，应该会发生什么情况，它将验证名字和姓氏是否具有值……(规则本身我应该能够设置)然后执行切换。如果任何字段无效，我希望输入/填充为红色或类似效果。如果一切都通过验证，那么它将继续并显示下一个部分，该部分本身将仅验证它自己的部分，依此类推。

我很感激可以提供的任何帮助，我一直在努力研究示例，但还没有能够使任何工作正常进行。

Answer 1

使用这个:

      $(".go_section2").click(function(){
        if($(this).find('input:text').val()!==""&&$(this).find('input:text').val()!==null){
        $("#section2").slideDown("slow");
}
else{
$(this).find('input:text').css('border','1px solid red');
}
    });

并确保将 type="text" 添加到文本输入中