我想根据复选框选择显示/隐藏div。根据复选框选择隐藏/显示div
这里的情景,
- 我有一个div两个检查框名为决胜局,
- 选择复选框应该显示事业部盒一个
- 选择复选框两者要展示DIV箱两
一旦有人做出了选择,我想决胜局 DIV隐藏。我不能够使这项工作
$(function() {
\t $('.decider').removeClass('hide');
\t $('.box-one').addClass('hide');
\t $("#optionTwo").click(function() {
\t $('#optionOne').attr("checked",false);
\t });
\t $("#optionOne").click(function() {
\t $('#optionTwo').attr("checked",false);
\t });
\t $("#send-decide").click(function() {
\t \t if($('#optionTwo').is(':checked')){
\t \t \t $('.decider ').addClass('hide');
\t \t \t $('.box-one').removeClass('hide');
\t \t }
\t \t if($('#optionOne').is(':checked')){
\t \t \t $('.decider ').addClass('hide');
\t \t \t $('.box-two').removeClass('hide');
\t \t }
\t });
});
<div class="decider hide">
<p style="font-size:10px;color:#000;">Please select an option below</p>
<label class="checkbox">
<input id="optionTwo" type="checkbox" name="Request" value="Request" />
Select Box one </label>
<label class="checkbox">
<input id="optionOne" type="checkbox" name="Download" value="Download" />
Select Box two </label>
<br />
<span class="select">
<input type="button" id="send-decide" alt="submit" value="select" />
</span> </div>
<div class="box-one">
<p>this is first box</p>
</div>
<div class="box-two hide">
<p>this is second box</p>
</div>
尝试设置CSS属性'display:block'和'display:none' –