我有3个单选按钮,点击它们每个都会出现一个表单,并且每个表单里面都会有3个步骤。我在单击单击按钮上创建了一个带有多步骤的表单。但我在制作另外两个时遇到了麻烦。请帮帮我
答案 0 :(得分:0)
我已经创建了一个基本结构,这样当你点击表单1单选按钮时,表单1将打开,同一个进程将用于表单2和表单3.
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
</head>
<style type="text/css">
.dsp_none
{
display:none;
}
</style>
<input type="radio" class="form1" name="form1"/>Form1 <br>
<input type="radio" class="form2" name="form1" />Form2 <br>
<input type="radio" class="form3" name="form1" />Form3 <br>
<div class="form1_form dsp_none">
This is form1
</div>
<div class="form2_form dsp_none">
This is form2
</div>
<div class="form3_form dsp_none">
This is form3
</div>
<script type="text/javascript">
jQuery('document').ready(function(){
jQuery('.form1').click(function(){
jQuery('.form1_form').css('display','block');
jQuery('.form2_form').css('display','none');
jQuery('.form3_form').css('display','none');
});
jQuery('.form2').click(function(){
jQuery('.form2_form').css('display','block');
jQuery('.form3_form').css('display','none');
jQuery('.form1_form').css('display','none');
});
jQuery('.form3').click(function(){
jQuery('.form3_form').css('display','block');
jQuery('.form1_form').css('display','none');
jQuery('.form2_form').css('display','none');
});
});
</script>
只需要将您为一个多步骤表单创建的代码粘贴到div中,该类是form1_form,form2_form,form3_form。并相应地更改多步形式的类。