As follows:
Step 1 fill in the basic information,
Step 2 fill in the Education Information
Verification is required for each step, so that verification can be performed in the following ways:
Copy codeThe Code is as follows:
<Script type = "text/javascript" language = "javascript" src = "/Scripts/jquery-1.4.1.min.js"> </script>
<Script type = "text/javascript" language = "javascript" src = "/Scripts/jquery. validate. min. js"> </script>
<H2>
ValidateStep <Form action = "" id = "registerForm" method = "post">
<Div class = "step1 validationGroup" style = "display: block;">
<P>
Basic Information </p>
<Table border = "0" cellpadding = "0" cellspacing = "0">
<Tr>
<Td>
Name: <input type = "text" id = "name" class = "required"/>
</Td>
</Tr>
<Tr>
<Td>
Age: <input type = "text" id = "age" class = "required number"/>
</Td>
</Tr>
<Tr>
<Td>
<Input type = "button" class = "next" value = "next"/>
</Td>
</Tr>
</Table>
</Div>
<Div class = "step2 validationGroup" style = "display: none">
<P>
Educational background </p>
<Table border = "0" cellpadding = "0" cellspacing = "0">
<Tr>
<Td>
Graduation school: <input type = "text" id = "school" class = "required"/>
</Td>
</Tr>
<Tr>
<Td>
Major: <input type = "text" id = "major" class = "required"/>
</Td>
</Tr>
<Tr>
<Td>
<Input type = "submit" value = "submit"/>
</Td>
</Tr>
</Table>
</Div>
</Form>
<Script language = "javascript" type = "text/javascript">
Function InitValidationGroup (){
$ ('. ValidationGroup. next'). click (function (evt ){
If (IsValidated ($ (this). closest (". validationGroup "))){
$ (". Step1"). hide ();
$ (". Step2"). show ();
}
Else {
Evt. preventDefault ();
}
});
$ ('. Step1: text'). keydown (function (evt ){
If (evt. keyCode = 13 ){
Var $ nextInput = $ (this). nextAll (': input: first ');
If ($ nextInput. is (': submit ')){
Validate (evt );
}
Else {
Evt. preventDefault ();
$ NextInput. focus ();
}
}
});
}
Function IsValidated (group ){
Var isValid = true;
Group. find (': input'). each (function (I, item ){
If (! $ (Item). valid ())
IsValid = false;
});
Return isValid;
}
$ (Document). ready (function (){
InitValidationGroup ();
Var validator = $ ("# registerForm"). validate ();
});
</Script>