jquery - habilitar - Cómo obtener una devolución de llamada de intercambio en los botones de opción, pero solo el que se configuró

habilitar o deshabilitar un input con javascript

Question

Tengo un grupo de botones de opción con el mismo nombre, pero diferentes valores. Me gustaría hacer algo como:

$("#langs").on("change", "[name=locale]", myfunction);

Esto funciona, pero cuando hago clic en un nuevo botón de radio mi función se llama dos veces: una vez para el botón de radio "viejo" que se desactiva automáticamente, y una vez para el nuevo que estoy haciendo clic en.

cambiar onchange a onclick no es una solución, porque lo uso con jquery-mobile y envuelve las entradas con etiqueta, por lo que se hace clic en la etiqueta, no en la entrada.

Answer 1

¿Qué tal intentar algo como esto?

<div data-role="fieldcontain">
     <fieldset data-role="controlgroup" data-type="horizontal">
     <input type="radio" name="langs" id="first" value="1" onchange="myfunction();"/>
     <label for="first">First</label>
     <input type="radio" name="langs" id="second" value="2" onchange="myfunction();"/>
     <label for="second">Second</label>
     </fieldset>
</div>

Y entonces:

function myfunction(){
    if($("#langs option:selected")){
    //do something, for example
        alert($("#langs option:selected").text());
    }
}

Esto debería llamar a la función solo una vez, ya que está contenida dentro del elemento que necesita usarla.

Answer 2

Por lo que yo sé, no tiene ninguna restricción para utilizar onclick evente con jquery en una etiqueta. Si tiene una identificación, puede usarla. Digamos que tienes el siguiente html:

<label for="foo" id="whatever1">foo</label><input type="radio" name="radiogroup_0" value="foo" >
<label for="bar" id="whatever2">bar</label><input type="radio" name="radiogroup_1" value="bar" >

En tu jquery podrías agregar:

$(''#whatever1'').click(
  function(){
    //paste your code inside
  }
);

Lo mismo para la etiqueta del otro botón de opción

$(''#whatever1'').click(
  function(){
    //paste your code inside
  }
);

Espero que esto ayude. Luis M.

Answer 3

Puede pasar $(this) como argumento a myfunction y luego dentro de myfunction comprobar si el botón de radio está marcado

$("#langs").on("change", "[name=locale]", function() { myfunction($(this)); } );

function myfunction(elem) {
    if(elem.is('':checked'')) {
        // code here
    }
}

Answer 4

¿Esto funciona para tí? Siguiendo los jQM Docs

• Ejemplo 1
• Ejemplo 2 (diversión)

HTML:

<div data-role="page"> 
    <fieldset data-role="controlgroup">
        <legend>Choose a language:</legend>
        <input type="radio" name="langs" id="english-lang" value="en" />
        <label for="english-lang">English</label>
        <input type="radio" name="langs" id="korean-lang" value="ko" />
        <label for="korean-lang">Korean</label>
    </fieldset>
</div>​

JS:

$("input[name=langs]:radio").bind( "change", function(event, ui) {
    console.log(''Lang: ''+$(this).val());

    // Call function here
});