这里我有三个fieldset如果我选择第一个无线电输入,第一个形式的fieldset显示我选择第二个无线电输入然后第二个fieldset显示提交按钮。
请帮忙。
<form id="msform">
<!-- progressbar -->
<ul id="progressbar">
<li class="active">Account Setup</li>
<li>Social Profiles</li>
<li>Personal Details</li>
</ul>
<!-- fieldsets -->
<fieldset>
<div class="switch-field">
<input type="radio" id="switch_3_left" name="switch_3" value="Social Media Seller" checked/>
<label for="switch_3_left"><img src="images/Social.png"><h2>Social Media Seller</h2></label>
<input type="radio" id="switch_3_center" name="switch_3" value="Online Store" />
<label for="switch_3_center"><img src="images/Online.png"><h2>Online Store</h2></label>
<input type="radio" id="switch_3_right" name="switch_3" value="no" />
<label for="switch_3_right"><img src="images/Company.png"><h2>Exciting Company</h2></label>
</div>
<input type="button" name="next" id="btn-next" class="next action-button col-md-3" value="Next Step" />
</fieldset>
<fieldset id="left">
<h2 class="fs-title">Social Profiles</h2>
<h3 class="fs-subtitle">Your presence on the social network</h3>
<input type="text" name="twitter" placeholder="Twitter" />
<input type="text" name="facebook" placeholder="Facebook" />
<input type="text" name="gplus" placeholder="Google Plus" />
<input type="button" name="next" class="next action-button col-md-3" value="Next" />
</fieldset>
<fieldset id="center">
<h2 class="fs-title">Personal Details</h2>
<h3 class="fs-subtitle">We will never sell it</h3>
<input type="text" name="fname" placeholder="First Name" />
<input type="text" name="lname" placeholder="Last Name" />
<input type="text" name="phone" placeholder="Phone" />
<textarea name="address" placeholder="Address"></textarea>
<input type="button" name="previous" class="previous action-button" value="Previous" />
<input type="submit" name="submit" class="submit action-button" value="Submit" />
</fieldset>
以下是带有此代码的jquery详细信息,其中选中了每个单选按钮,它显示了相同的表单字段集。
jQuery('<div class="quantity-nav"><div class="quantity-button quantity-up">+</div><div class="quantity-button quantity-down">-</div></div>').insertAfter('.quantity input');
jQuery('.quantity').each(function() {
var spinner = jQuery(this),
input = spinner.find('input[type="number"]'),
btnUp = spinner.find('.quantity-up'),
btnDown = spinner.find('.quantity-down'),
min = input.attr('min'),
max = input.attr('max');
btnUp.click(function() {
var oldValue = parseFloat(input.val());
if (oldValue >= max) {
var newVal = oldValue;
} else {
var newVal = oldValue + 1;
}
spinner.find("input").val(newVal);
spinner.find("input").trigger("change");
});
btnDown.click(function() {
var oldValue = parseFloat(input.val());
if (oldValue <= min) {
var newVal = oldValue;
} else {
var newVal = oldValue - 1;
}
spinner.find("input").val(newVal);
spinner.find("input").trigger("change");
});
});
请指导我。
谢谢。