我试图通过两个单选按钮切换一个div。如果问题(emStudent& anotherDegree)或两个问题的值是"是"然后出现div(#student-discount-wrap)。如果emStudent的价值是"是的,"我有它的工作。但我不确定如何设置"或"另一个条件是有条件的。我试过了几个||声明,但避风港能够得到任何工作。帮助meeeeee! :(
这是我的HTML:
<div class="form-group row">
<label class="col-sm-12" for="emStudent"><strong>Are you a student:</strong></label><br/>
<div class="radio col-sm-12">
<label><input type="radio" class="cbct-radio" name="emStudent" value="Yes" id="emYes">Yes</label>
</div>
<div class="radio col-sm-12">
<label><input type="radio" class="cbct-radio" name="emStudent" value="No" id="emNo">No</label><br/>
<label for="emStudent" class="error"></label>
</div>
</div>
<div class="form-group row">
<label class="col-sm-12" for="anotherDegree"><strong>Are you a student at another degree or certificate-granting program:</strong></label><br/>
<div class="radio col-sm-12">
<label><input type="radio" class="cbct-radio" name="anotherDegree" value="Yes" id="anotherYes">Yes</label>
</div>
<div class="radio col-sm-12">
<label><input type="radio" class="cbct-radio" name="anotherDegree" value="No" id="anotherNo">No</label><br/>
<label for="anotherDegree" class="error"></label>
</div>
</div><div class="form-group row" id="student-discount-wrap">
<label class="col-sm-12" for="studentDiscount"><strong>For Student Discount:</strong> Please list your institution and expected date of graduation (or graduate program). If a student, list your school e_mail address above. Other students may be asked to provide additional documentation.</label><br/>
<textarea name="studentDiscount" id="studentDiscount" class="form-control col-sm-12 textarea" rows="3"></textarea>
</div>
这是我的JS用于切换div的一个单选按钮:
$("input:radio[name='emStudent']").click(function(){
if(this.value == "Yes"){
$("#student-discount-wrap").show();
}else{
// hide the dependent fields and blank them
$("#student-discount-wrap").hide();
}
});
答案 0 :(得分:1)
首先选择两个广播组,然后添加change
事件处理程序,并查看是否有任何组都有checked
广播,其值为Yes
var radios = $("input[type=radio][name='emStudent'], input[type=radio][name='anotherDegree']");
radios.on('change', function() {
var hasYes = radios.filter(function() {
return this.checked && this.value === 'Yes';
}).length > 0;
$("#student-discount-wrap").toggle(hasYes);
});
答案 1 :(得分:1)
您可以使用另一种简单方法:
$(".cbct-radio").click(function(){
if($('.cbct-radio[value="No"]:checked').length == 0) { // if no radio with class ".cbct-radio" and value "No" is checked
$('#student-discount-wrap').show();
} else {
$('#student-discount-wrap').hide();
}
});