Soy un novato en JavaScript. Tengo varios botones de radio en mi página dinámica y quiero crear un script para hacer lo siguiente:

HTML:

    <input type="radio" id="elemainfoto">
    <input type="radio" id="elemainfoto">
    <input type="radio" id="elemainfoto">

JavaScript:

    var radio = '#elemainfoto',
    if(radd.value == 0) {
        radd.checked the first radio element,
    } else {
        keep the way it is,
    }

Si ninguno de los elementos de radio están marcados, marca la primera obligatorio.

  • document.querySelectorAll('[type="radio"]')[0].checked = true? Ow.. y usted no puede tener Identificadores duplicados, por lo que su HTML no es válido.
  • Válido página HTML puede tener Identificadores duplicados. Este código no funcionaría . Cambiar el ID de la clase, y cambiar el pseudocódigo reales de la sintaxis. Usted debe llegar (muy cerca) para su solución
  • ¿Quieres un defecto tipo de comportamiento?
  • Puedo usar jquery?
  • Sí, Amit Joki. Jquery es genial!
  • Simplemente ajusta el primero como el valor predeterminado seleccionado, ninguna secuencia de comandos necesarios.
  • posibles duplicados de cómo comprobar un botón de radio con jQuery?

5 Comentarios

  1. 5

    Yo que su expectativa es que el primer elemento seleccionado de forma predeterminada, entonces usted debe utilizar HTML y javascript no por eso y por favor tenga en cuenta que usted no debe usar dos elementos HTML con el mismo id en su caso, usted debe reemplazar por una clase y/o agregar la Id de los elementos.

    <input type="radio" class="elemainfoto" id="item1" checked>
    <input type="radio" class="elemainfoto" id="item2">
    <input type="radio" class="elemainfoto" id="item3>

    Actualizado la respuesta basada en la RobG comentario.

    • Los botones de radio se generan de forma dinámica, por lo que no puedo hacer eso.
    • La marcada atributo es un atributo booleano, no tiene ningún valor. Donde se requiere uno (que es sólo para XHTML, que no es utilizado en la web) el valor debe ser el mismo que el nombre del atributo, es decir,checked="checked".
    • claro que puede, sólo tienes que configurar el checked atributo o defaultChecked de la propiedad una vez que los botones se crean.
    • es el problema de que cuando se genera dinámicamente un diferentes opción puede ser seleccionada (tal vez con base en valores de base de datos?) y lo que es necesario para permitir que y no sólo definir la primera como predeterminado ?
  2. 3

    Algo como esto en el más puro JS (he cambiado los identificadores de las clases de un identificador debe ser único):

    var radio = document.querySelectorAll('.elemainfoto'),
        checked = false;
    
    for (var i = 0; i < radio.length; i++) {
        if (radio[i].checked) {
            checked = true;
            break;
        }
    }
    
    if (!checked) {
        radio[0].checked = true;
    }
    else {
        alert('something is checked')
    }

    Un poco más corto con jQuery:

    var $radio = $('.elemainfoto');
    
    if (!$radio.filter(':checked').length) {
        $radio[0].checked = true;
    }
    else {
        alert('something is checked')
    }
    • Filtro parece que sería bastante ineficiente en este caso. No podría usted acaba de hacer if(!$('.RB:checked').length)
    • Yo podría, pero sería menos eficiente debido a que el interior de if usted necesita para volver a seleccionar el radio de la colección de nuevo.
    • Ah, ya veo lo que estás haciendo ahora. Eso es inteligente. Yo nunca he usado antes. Aprender algo nuevo todos los días. Gracias amigo. 🙂
  3. 0

    usando el atributo ‘id’ en html con el mismo valor más de una vez no es válida, se debe utilizar un «nombre» para una entrada.

    HTML:

    <input type="radio" name="elementinfoto" value="1" />
    <input type="radio" name="elementinfoto" value="2" />
    <input type="radio" name="elementinfoto" value="3" />

    JavaScript:

     var radio = document.getElementsByName('elementinfoto'); //get all radio buttons
     var isChecked = 0; //default is 0 
     for(var i=0; i<radio.length;i++) { //go over all the radio buttons with name 'elementinfoto'
       if(radio[i].checked) isChecked = 1; //if one of them is checked - tell me
     }
    
     if(isChecked == 0) //if the default value stayed the same, check the first radio button
       radio[0].checked = "checked";

    ejemplo: http://jsfiddle.net/yxm4N/2/

  4. 0

    Un grupo de botones de radio está formado por dar a los botones de la radio del mismo nombre. Un IDENTIFICADOR es opcional y por lo general no es necesario. Si un ID de siempre, cada uno debe tener un valor diferente. Y los botones deben tener un valor, de modo que hay un punto a su existencia.

    Tener un botón seleccionado por defecto, basta con establecer el elegido del botón comprobado atributo:

    <form id="foo">
      <input type="radio" name="elemainfoto" valu="0" checked>0<br>
      <input type="radio" name="elemainfoto" valu="1">1<br>
      <input type="radio" name="elemainfoto" valu="2">2<br>
      <input type="reset">
    </form>

    Ahora bien, si ningún otro botón es seleccionado, o el formulario de reset, un botón será seleccionado. Tenga en cuenta que si no se establece un botón como el valor predeterminado seleccionado, a continuación, una vez que un usuario se comprueba un botón, la única manera para anular la selección es para seleccionar el botón de radio en el mismo grupo, o el uso de un botón de reset (si se proporciona).

    Si desea establecer el valor predeterminado marcada en el botón de secuencia de comandos, hay un par de opciones. Uno es:

    var buttons = document.getElementsByName('elemainfoto');
    buttons[0].defaultChecked = true;

    Si usted realmente desea para comprobar si se selecciona, agregue un botón como el de la siguiente forma:

      <input type="button" value="Check buttons" onclick="checkButtons(this);">

    A continuación, el checkButtons función puede ser:

    function checkButtons(el) {
      var buttons;
      var form = el && el.form;
    
      if (form) {
        buttons = form.elemainfoto;
    
        for (var i=0, iLen=buttons.length; i<iLen; i++) {
    
          //If a button is checked, return its value
          if (buttons[i].checked) {
            return buttons[i].value;
          }
        }
      }
      //Otherwise, try to check the first one and return undefined
      buttons && buttons[0].checked;
    }
  5. 0

    usted necesita saber cómo utilizar la radio del elemento. Id es único en la página html. usted debe asignar el mismo nombre para cada elemento radio.

    <input type="radio" name="elemainfoto" id="first" value="1" />
    element 1
    <input type="radio" name="elemainfoto" id="second" value="2" />
    element 2
    <input type="radio" name="elemainfotor" id="thrid" value="3" /> 
    element 3

    si desea comprobar el primer botón de opción como predeterminada, se establece en las de entrada etiqueta de atributo.

    <input type="radio" name="elemainfoto" id="first" value="1" checked="true"/>
        element 1

    o se puede hacer con javascript también,

    $("input:radio[name=elemainfoto]:first").attr('checked', true);

    puede realizar la acción de cada botón de radio haga clic en, para saber qué elemento está marcada

    $(function(){
      $('input[type="radio"]').click(function(){
        if ($(this).is(':checked'))
        {
          alert($(this).val());
        }
      });
    });

    si quieres realizar una acción separada para cada uno de los botones de radio, pruebe este código a continuación

    $(function () {
        $('input[type="radio"]').click(function () {
            if ($(this).is(':checked')) {
                if ($(this).val() == '1') alert('first radio element is checked');
                if ($(this).val() == '2') alert('second radio element is checked');
                if ($(this).val() == '3') alert('third radio element is checked');
            }
        });
    });

    VER ESTE VIOLÍN DEMO

Dejar respuesta

Please enter your comment!
Please enter your name here