jquery: how to check if all radio buttons in a div are selected

Question

my html looks like this

  
  

        
                      

              相关标签:
       
      

Answer 1

Restructure your HTML slightly - wrap each radio group in (say) a div. Then you can just do something like this to validate the form when the user submits it:

if ($('div:not(:has(:radio:checked))').length) {
    alert("At least one group is blank");
}

Of course this can be tweaked in various ways to suit your HTML. The idea was from Find all radio groups which haven't been selected

Answer 2

Try this one:

$('input:radio', $('#div1')).each(function() {
    if(name && name == $(this).attr('name'))
        return true; // Skip when checking the same element name. 

    name = $(this).attr('name');

    if(! $('input:radio[name="' + name + '"]:checked').length) {
        alert('Oops, you missed some input there.. [' + name + ']');
        return false;
    }
});

It will loop through every radio button to check for checked radio & will break as soon it found non-checked radio group (first error found). But if you prefer to get all the errors (not only the first error found), just remove return false.

Answer 3

$(":radio").change(function() {
    var names = {};
    $(':radio').each(function() {
        names[$(this).attr('name')] = true;
    });
    var count = 0;
    $.each(names, function() { 
        count++;
    });
    if ($(':radio:checked').length === count) {
        alert("all answered");
    }
}).change();

Demo: http://jsfiddle.net/yFaAj/15/

Answer 4

Solution here http://jsfiddle.net/QxdnZ/1/

    var checked = $("#div1 :radio:checked");
    var groups = [];
    $("#div1 :radio").each(function() {
        if (groups.indexOf(this.name) < 0) {
            groups.push(this.name);
        }
    });
    if (groups.length == checked.length) {
        alert('all are checked!');
    }
    else {
        var total = groups.length - checked.length;
        var a = total>1?' groups are ':' group is ';

        alert(total + a + 'not selected');
    }

Answer 5

This will work:

if($("#div1").children("input:radio:checked").size() == 3) 
{
   alert('three inputs were checked'); 
}

Answer 6

Try this:

function check(){
    var allCheck = true;
    if($("#div1 :radio:checked").length==0){
        allCheck=false;
    }
    $("#div1 :radio").each(function(){
    for(var i=0;i<$("#div1 :radio:checked").length;i++)
    if($(this).attr("name")===$($("#div1 :radio:checked")[i]).attr("name")) 
                break;
    else if(i==$("#div1 :radio:checked").length-1) 
                allCheck = false;
    });

    return allCheck;
}