Question

我想创建一个Jquery表单，具有这样的表单结构

panel1{
Name
address
age 
years of experience
}

panel2{
graduation deatails.
first year marks
second year marks
third year marks
}

panel3{

some more fileds

}

然后a NEXTButton previousButton

我想知道，起初只有第一个面板应该是可见的当我舔下一个按钮时，第二个面板应该是可见的，第一个和第三个应该隐藏' 反之亦然。我也希望这个值应该是持久的，并在下一个和普遍的，并且验证应该适用

有些人可能会建议我如何实现这一点，我是新手。

Answer 1

<div id="step1">
    <div>Content1 <span id="go_to_2">Next</span></div>
</div>

<div id="step2" style="display:none;">
    <div>Content2 <span id="back_to_1">Previous</span><span id="go_to_3">Next</span></div>
</div>

<div id="step3" style="display:none;">
    <div>Content4 <span id="back_to_2">Previous</span><span id="finish">finish</span>
</div>

Jquery的：

$('#go_to_2').click(function(){
    ('#step1').hide();
    ('#step2').show();
});
$('#go_to_3').click(function(){
    ('#step2').hide();
    ('#step3').show();
});
$('#finish').click(function(){
    ('#step3').hide();
    // Submit form etc
});
$('#back_to_1').click(function(){
    ('#step2').hide();
    ('#step1').show();
});
$('#back_to_2').click(function(){
    ('#step3').hide();
    ('#step2').show();
});

希望这有帮助。

Answer 2

您可以使用不同的div标签并使用它们显示/隐藏它们 jquery .show（）/。hide（）方法

$("#divId").show();

如何制作Jquery表单？面板更改的持续价值

2 个答案: