首页 > 解决方案 > 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>

在此处输入图像描述

标签: javascriptjquery

解决方案


您需要检查是否radiochecked,而不是检查是否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>


推荐阅读