jQuery选择器或'if'麻烦

问题描述 投票:0回答:1

此代码应禁止总共单击两个以上的单选按钮(此类按钮有三组)。

这在没有容器''label'的情况下有效,但是在没有容器的情况下,它不起作用(看起来'if'构造不起作用;所有写在外部的东西它工作正常)

如何在不去除标签的情况下起作用?有什么解决方法吗?

var radio_limit = 2;

$('.pricing-levels-3 label input').on('change', function(evt) {

   if($(this).siblings(':checked').length >= radio_limit) {
       this.checked = false;
   };
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class="pricing-levels-3">
         <p><strong>Select 2 Levels</strong></p>
         <label>
           <input type="radio" name="vehicle" value="1">Level 1<br>
           <input type="radio" name="vehicle" value="2">Level 2<br>
           <input type="radio" name="vehicle" value="3">Level 3<br>
         </label>
         <label>
           <br>
           <input type="radio" name="vehicle2" value="1">Level 1<br>
           <input type="radio" name="vehicle2" value="2">Level 2<br>
           <input type="radio" name="vehicle2" value="3">Level 3<br>
         </label>
         <label>
           <br>
           <input type="radio" name="vehicle3" value="1">Level 1<br>
           <input type="radio" name="vehicle3" value="2">Level 2<br>
           <input type="radio" name="vehicle3" value="3">Level 3<br>
           <br>
         </label>
</div>
javascript jquery if-statement jquery-selectors
1个回答
0
投票

您正在寻找没有标签的兄弟姐妹。现在有了标签,他们不再是兄弟姐妹。要解决此问题,我们使用最近的()读取了同一div中的所有单选按钮。还可以使用prop检查单选按钮。这样做:

var radio_limit = 2;

$('.pricing-levels-3 label input').on('change', function(evt) {

   if($(this).closest('div').find('input:checked').length >= radio_limit) {
       $(this).prop('checked', false);
   };
});
© www.soinside.com 2019 - 2024. All rights reserved.