jQuery 选择器或"if"问题

Question

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

当没有容器'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>

Answer 1

您正在寻找没有标签的兄弟姐妹。现在有了标签，他们就不是兄弟姐妹，而是表亲。为了解决这个问题，我们使用closest((读取同一div中的所有单选按钮。同时使用道具检查单选按钮。这样做：

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);
};
});