2009-07-22 104 views
15

En jQuery, me gustaría seleccionar todos los grupos de botones de opción donde no hay botones marcados.jQuery y grupos de botones de opción

O, ¿hay alguna manera en la que pueda seleccionar todos los grupos de botones de radio e iterar a través de los grupos?

Estoy agregando dinámicamente N grupos de botones de radio a una página y no sabré, de antemano, cuáles serán los nombres de los grupos de botones de opción.

+0

¿puedes poner una muestra html? –

Respuesta

34

para encontrar todos los grupos de radio:

var radio_groups = {} 
$(":radio").each(function(){ 
    radio_groups[this.name] = true; 
}) 

para encontrar qué grupo de radio ha comprobado cajas de radio y que no tiene:

for(group in radio_groups){ 
    if_checked = !!$(":radio[name='"+group+"']:checked").length 
    alert(group+(if_checked?' has checked radios':' does not have checked radios')) 
} 
+2

que hace !! defender y por qué? –

+0

[Duble NOT, convierte el valor booleano dos veces seguidas así '!! true = true'] (http://stackoverflow.com/questions/1406604/what-does-the-operator-double-exclamation-point- mean-in-javascript/1406618 # 1406618) –

+0

Sé que esto es viejo, ¡pero esto me ha ayudado tanto! Solo quería una forma simple de asegurar que cada uno de mis grupos de botones de radio estuviera seleccionado, y aquí está. – LittleTreeX

0

Soporte para múltiples grupos y pre-seleccionada.

$('input').click(function() { 
    var $t = $(event.target); 
    if ($t.hasClass('checked')) $t.removeAttr('checked'); 
    else $('input[type="radio"][name="' + $t.prop('name') + '"]').not($t).removeClass('checked'); 
    $t.toggleClass('checked'); 
}).filter(':checked').addClass('checked');​ 

`` `

Prueba: http://jsfiddle.net/abrkn/PGW2Z/

0

Para seleccionar toda la radio por nombre de grupo y obtener sólo la lista de nombres diferentes:

function selectRadioByGroupName() { 
     return $.unique($('input:radio').map(function(index, element) { 
      return this.name; 
     })); 
    } 

Un fragmento de ejemplo:

function selectRadioByGroupName() { 
 
    return $.unique($('input:radio').map(function(index, element) { 
 
    return this.name; 
 
    })); 
 
} 
 

 

 

 
$(function() { 
 
    selectRadioByGroupName().each(function(index, element) { 
 
    $('body').append($('<p>First Group name is: ' + element + '</p>')); 
 
    }); 
 
});
<script src="https://code.jquery.com/jquery-1.12.1.min.js"></script> 
 

 
<form action=""> 
 
    <p> 
 
     Q1: 
 
    </p> 
 
    <input type="radio" name="gender" value="male"> Male<br> 
 
    <input type="radio" name="gender" value="female"> Female<br> 
 
    <input type="radio" name="gender" value="other"> Other 
 
    <br /> 
 
    <p> 
 
     Q2: 
 
    </p> 
 
    <input type="radio" name="status" value="male"> Single<br> 
 
    <input type="radio" name="status" value="female"> Married<br> 
 
    <input type="radio" name="status" value="other"> Other 
 
    <br /> 
 
    <input type="button" name="submit_id" value="Submit" onclick="submitAnswers()"> 
 
</form>

Después de obtener los diferentes nombres de grupo, es posible hacer un ciclo sobre ellos.

Cuestiones relacionadas