javascript - JS - 在是/否选项更改时检查是否选择了所有“否”选项
问题描述
如何检查是否选择了是/否表上的所有“否”答案,这必须检查对任何是/否答案的每次更改,然后在选择所有“否”时发送警报
尝试了以下但没有看到任何反应..
$('.mb-n').change(function(){
if ($('.mb-n:checked').length == $('.mb-n').length) {
alert('all no ');
} else { alert('all y ');
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tr class="mb-odd">
<td class="mb-prompt"><span>Q1.</span></td>
<td class="mb-y"><input type="radio" name="123" value="Y" class="{required: true, messages:{required:''}}" rel="" id="123_Y"></td>
<td class="mb-n"><input type="radio" name="123" value="N" checked="checked" id="123_N" rel=""></td>
</tr>
</table>
解决方案
您需要检查是否radio
是checked
,而不是检查是否td
是(<td>
没有checked
属性)。
我对您的代码进行了一些调整,包括对 HTML 的修改,这有点奇怪。我为所有单选按钮添加了一个类似的类,并为所有 YES 单选和 NO 单选添加了一个类似的类,这样您就可以更好地控制选择的内容和未选择的内容。
检查下面
$('.radioBtn').change(function(){
if ($('.radioNo:checked').length == $('.mb-n').length) {
console.log('all no');
} else if ($('.radioYes:checked').length == $('.mb-y').length){
console.log('all yes');
}else{
console.log("Some Yes and some No")
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tr class="mb-odd">
<td class="mb-prompt"><span>Q1.</span></td>
<td class="mb-y">
<input type="radio" name="123" value="Y" class="radioBtn radioYes" id="123_Y">YES
</td>
<td class="mb-n">
<input type="radio" name="123" value="N" class="radioBtn radioNo" checked id="123_N" >NO
</td>
</tr>
<tr class="mb-odd">
<td class="mb-prompt"><span>Q2.</span></td>
<td class="mb-y">
<input type="radio" name="1234" value="Y" class="radioBtn radioYes" id="1234_Y">YES
</td>
<td class="mb-n">
<input type="radio" name="1234" value="N" class="radioBtn radioNo" checked id="1234_N" >NO
</td>
</tr>
<tr class="mb-odd">
<td class="mb-prompt"><span>Q3.</span></td>
<td class="mb-y">
<input type="radio" name="12345" value="Y" class="radioBtn radioYes" id="12345_Y">YES
</td>
<td class="mb-n">
<input type="radio" name="12345" value="N" class="radioBtn radioNo" checked id="12345_N" >NO
</td>
</tr>
</table>
推荐阅读
- domain-driven-design - 依赖于其他聚合的聚合的 EventSourcing
- c++ - C ++重载比较运算符与强制转换运算符
- php - 为什么我不能在这段代码 [PHP-CURL] 中使用相同的 cookie 访问两个不同的网页?
- javascript - 检查数组中的所有值是否为真,然后返回一个真布尔语句(javascript)
- python - Leetcode Longest Common Prefix 运行时错误
- regex - 删除行的正则表达式
- android - Android - gRPC 客户端 - 从 Java 到 Kotlin
- javascript - CS50 PSet8 混搭 - 标记不显示在 Google 地图上
- php - 将值从一个数据库更新到另一个数据库 - 最快的方法
- php - 根据 Woocommerce 中的自定义价格更改产品价格