仅当所有选定元素的值都等于“否”时,才发出警报。
我尝试使用.val
,但不确定(如果或..)仅在两个单选按钮都获得值.click
时如何使用"n"
来获得警报:
$('input[name="q1"], input[name="q2"]').change(function() {
if ($(this).val() == 'y') {
alert('Yes if any');
}
else {
// both radio buttons with "No" value: (how to)
/*
if ($(this).click().val == 'n'){
alert('No if both');
}
*/
alert('No if both');
}
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="form-group">
<p>Q1</p>
<input type="radio" name="q1" value="y">Yes
<input type="radio" name="q1" value="n">No
</div>
<div class="form-group">
<p>Q2</p>
<input type="radio" name="q2" value="y">Yes
<input type="radio" name="q2" value="n">No
</div>
仅当两个单选按钮的值都为"n"
时,我才想显示第二个警报,但是在这种情况下,我不知道如何让Jquery同时检查多个值。 / p>
答案 0 :(得分:1)
获取所选单选按钮值的数组,然后可以使用数组方法,例如includes
和every
:
const $inputs = $('input[name="q1"], input[name="q2"]');
$inputs.change(function() {
const vals = $inputs
.filter(':checked')
.map((_, input) => input.value)
.get();
if (vals.includes('y')) {
console.log('At least one "Yes"');
} else if (vals.length === 2 && vals.every(val => val === 'n')) {
console.log('Both "No"');
}
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="form-group">
<p>Q1</p>
<input type="radio" name="q1" value="y">Yes
<input type="radio" name="q1" value="n">No
</div>
<div class="form-group">
<p>Q2</p>
<input type="radio" name="q2" value="y">Yes
<input type="radio" name="q2" value="n">No
</div>
通过使用数组,可以轻松地将其扩展为更多的单选按钮组,而无需附加代码。
答案 1 :(得分:0)
检查输入时,对输入使用&&
运算符。使用:checked
选择器检查其检查状态。
您正在寻找的条件是这个
if($('input[name="q1"]:checked').val() =='n' && $('input[name="q2"]:checked').val()=='n')
alert('No if both');
}
$('input[name="q1"], input[name="q2"]').change(function() {
if ($(this).val() == 'y') {
alert('Yes if any');
}
else {
if($('input[name="q1"]:checked').val() =='n' && $('input[name="q2"]:checked').val()=='n')
alert('No if both');
}
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="form-group">
<p>Q1</p>
<input type="radio" name="q1" value="y">Yes
<input type="radio" name="q1" value="n">No
</div>
<div class="form-group">
<p>Q2</p>
<input type="radio" name="q2" value="y">Yes
<input type="radio" name="q2" value="n">No
</div>