Question

我想知道检查页面中所有单选按钮组的最佳方法。我的代码 -

<div class="radioGroup">
    Question1
    <input type="radio" value="1" name="group1"/>1
    <input type="radio" value="2" name="group1"/>2
    <input type="radio" value="3" name="group1"/>3
    <input type="radio" value="4" name="group1"/>4
</div>

<div class="radioGroup">
    Question2
    <input type="radio" value="1" name="group2"/>1
    <input type="radio" value="2" name="group2"/>2
    <input type="radio" value="3" name="group2"/>3
    <input type="radio" value="4" name="group2"/>4
</div>

<div class="radioGroup">
    Question3
    <input type="radio" value="1" name="group3"/>1
    <input type="radio" value="2" name="group3"/>2
    <input type="radio" value="3" name="group3"/>3
    <input type="radio" value="4" name="group3"/>4
</div>

<input type="button" value="check all radio Group selected"  onclick="validate();"/>

我写了一个javascript函数，但是我想要一个好的解决方案就是单选择器解决方案。

function validate(){
    var isNotSelected = false;
    $(".radioGroup").each(function(i,v){
        var grpName = $(this).find("input:first").attr("name");
        if($(this).find("[name='"+grpName+"']:checked").val() == undefined){
            isNotSelected  =true;   
        }
    });
    if(isNotSelected){
        alert("not all checked");   
    }
    else{
            alert("all checked");   
    }


}

提前致谢

Answer 1

你可以做到

var allChecked = !$('.radioGroup:not(:has(:checked))').length;

demonstration

Answer 2

检查总组数是否与包含已检查单选按钮的组数相匹配，如果是，则已选择所有组

$('.radioGroup').length === $('.radioGroup:has(input:checked)').length

检查所有无线电组是否已检查

2 个答案: