将表单转换为2/3部分并保持表单验证？

Question

我有一个包含20多个字段的表单，现在我绑定到iframe，我需要将表单分成更多部分。我怎样才能做到最好并仍然保持验证？

我试图保持简单，并且想要有3个div，每个包含7个表单字段和最后一节中的提交按钮。但是，我如何浏览这些部分并使每个部分的验证工作？

Answer 1

这样做的一种方法是将表单部分放在单独的div中，并且不要使用浏览器“导航”到单独的表单部分，而是使用jQuery来导航div。

<form>
<div id="form1"><a href="#">form elements 1</a></div>
<div id="form2" style="display:none"><a href="#">form elements 2</a></div>
<div id="form3" style="display:none"><a href="#">for elements 3</a></div>
</form>

<script>
jQuery("a").click( function(){
    jQuery(this).parents("form:first").children("div").hide();
    jQuery(this).parent().show();
});
</script>

并在最后一个div中设置提交按钮。

这将允许您使用javascript验证字段并向其显示包含错误的div。