<input type="radio" name="group" value="book_folder" onchange="makeRadioButtons()">Create New Book</input>

<input type="radio" name="group" value="book_chapter" onchange="makeCheckBoxes()">Create New Chapter</input>

Estaba usando el código anterior y cuando hice clic en el segundo botón de opción, pensé que debería obtener dos eventos, uno del botón que no estaba marcado y otro del botón que fue marcado, porque lógicamente hablando, ambos botones cambiaron su estado, y he vinculado el evento onchange () no el evento onclick (). pero como parece, solo obtengo un evento del botón que acaba de comprobarse. ¿Es este un comportamiento deseado en html? ¿Cómo puedo obtener un evento desde el botón si no está marcado?

29
samach 6 jul. 2011 a las 16:28

5 respuestas

La mejor respuesta

Use esto para obtener el comportamiento deseado: -

var ele = document.getElementsByName('group');
var i = ele.length;
for (var j = 0; j < i; j++) {
    if (ele[j].checked) { //index has to be j.
        alert('radio '+j+' checked');
    }
    else {
        alert('radio '+j+' unchecked');
    }
}

Espero que ayude.

11
gene 12 feb. 2013 a las 21:16

Para el navegador, N botones de radio con un nombre son solo un control. Porque cuando quiere enviar los datos de la publicación (u obtener datos) de vuelta al servidor, simplemente usa el atributo name como la clave del parámetro y el valor del botón de selección seleccionado actualmente que tiene ese atributo de nombre como El valor del parámetro enviado. Es por eso que debe nombrar atributo para agrupar radios. Entonces, onchange no debería ocurrir lógicamente 10 veces para 10 radios. Desde el punto del navegador, el valor del control group cambió de book_folder a book_chapter. Eso es todo.

5
Saeed Neamati 6 jul. 2011 a las 12:39

Ambas casillas de verificación forman un único elemento HTML, cuyo nombre es group. Es por eso que solo tienes un evento aquí.

Aquí es un ejemplo de demostración que muestra cómo recorrer cada casilla de verificación por separado y acceder a sus valores.

8
MD Sayem Ahmed 6 jul. 2011 a las 12:57

Puede usar una variable para guardar el valor del botón de opción marcado actual, de modo que cuando se active el evento, tendrá un valor de botón marcado anterior para guardar, y luego podría usar eso, porque solo una vez se marcará el botón de opción. después de eso, puede guardar el valor marcado del botón de opción actualizado

1
Ovais Khatri 6 jul. 2011 a las 12:35
 $(document).ready(function( ){
      $( "input[name='group']" ).on(
        {
          'change' : function( )
                     {
                       $.each( $( "input[name='group']" ),
                               function( )
                               {
                                 var ObjectId, ObjectValue;

                                 if( $(this).is(':checked') )
                                 {
                                   /*Checked radio button OBJECT */

                                   console.log(this);                      /* Jquery "this" Object */
                                   ObjectId    = $(this).attr( 'id' );     /* Id of above Jquery object */
                                   ObjectValue = $(this).val(  );          /* Value of above Jquery object */
                                 }
                                  else
                                 {
                                   /* UnChecked radio button OBJECT */
                                   console.log(this);                      /* Jquery "this" Object */
                                   ObjectId    = $(this).attr( 'id' );     /* Id of above Jquery object */
                                   ObjectValue = $(this).val(  );          /* Value of above Jquery object */
                                 }
                               }
                             );
                     }
        }
     );
  });
2
Parvesh Kumar Tandon 13 ene. 2014 a las 10:25