Question

我已基于记录将单选按钮放置在foreach循环中，单选按钮将显示为选项yes或no，所以可以说两个记录，因此单选按钮为yes或no的数量将为4

for record1 then rule no 1 from table //

<input type="radio" id="1" class="terms_"/>Yes
<input type="radio" id="2" class="terms_"/>No  

for record 2  then  rule no 2 from table//

<input type="radio" id="3" class="terms_"/>Yes
<input type="radio" id="4" class="terms_"/>No 

<input type="submit" class="validate" value="Submit"/>

因此，如果我没有从规则1中选择任何选项是或否，然后显示警报选择（是/否），再次出现，如果我没有为规则警报选择任何选项，请选择（是/否）从规则2开始，但是在我的代码中，我得到4次警报，但是我希望显示两个警报，因为选项只有两个。

 $(".validate").click(function() {
    $('.terms_').each(function() {
       if (!$(".terms_:checked").val()) {
          alert('Oops,Please select yes or no.');
       }
    });
 });

Answer 1

您可以将 name 属性添加到单选按钮以对其进行分组，然后检查长度以显示消息：

$(".validate").click(function(){
  var len = $('[name=rule1]:checked, [name=rule2]:checked').length;
  if (len <= 1)  {
    alert('Oops,Please select yes or no.'); 
    return false;
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<form>
  <div>
    <label>Rule 1</label>
    <input type="radio" id="1" name="rule1" class="terms_"/>Yes
    <input type="radio" id="2" name="rule1" class="terms_"/>No 
  </div>
  <div>
    <label>Rule 2</label>
    <input type="radio" id="3" name="rule2" class="terms_"/>Yes
    <input type="radio" id="4" name="rule2" class="terms_"/>No 
  </div>

  <input type="submit" class="validate" value="Submit"/>
</form>

如果未选中选项组中的单选按钮，则会收到警报？

1 个答案: