Forms 如何验证多步骤表单

我询问了如何验证多步骤表单，我创建了一个表单，它在同一页面中有三个部分

1.个人信息， 2.联系方式：， 3.确认细节。 我的问题是:

如果步骤1中的这些特定输入均有效并以#的形式返回“true”，则步骤2按钮将被激活/带您进入下一步；同样，如果步骤2中的所有特定输入均有效并返回true，则步骤3将被激活

使用jquery验证时如何分步验证表单

我的代码在这里：

$(document).ready(function() { 
var navHTML = '' + ''; $(function(){ 

        // init  
        $('#Form > div')  
            .hide()  
            .append(navHTML);  
        $('#first-step .prev-als').remove();  
        $('#last-step .form-next').remove();  

        // show first step  
        $('#first-step').show();  
$("a.form-next").click(function() { 

    var whichStep = $(this).parent().parent().attr('id');  



            if( whichStep == 'first-step' )  
            {  


      $("#first-step").validate();  
                if($("#form").valid()==false)  return false;      
//Dont navigate to second page  

            }  
            else if( whichStep == 'second-step' )  

            {                     

            }  

            else if( whichStep == 'last-step' )  
            {  
                // validate last-step  
            }  
$(this).parent().parent().hide().next().show(); }); 

$('a.prev-als ').click(function(){  
            $(this).parent().parent().hide().prev().show();  
        });  


    });  

});  

---

如果您想在浏览器中这样做，请考虑使用这里的jQuery向导插件：

---

这里可以找到正在运行的插件的演示：

谢谢Robert，我已经做了同样的程序，但我需要在每个步骤上添加验证（基本上是在div标签上），所以请指导我最好的方法。我个人不会在浏览器中这样做。无论如何，您都需要在服务器上验证输入，因此我将提供第一个页面，验证并保存它（大概是保存到数据库中），然后为下一步提供一个新页面。如果您仍然希望在浏览器中验证，您可以使用jQuery验证插件来执行此操作：