Come ottenere la richiamata onchange sui pulsanti di opzione, ma solo quella che era SET

Question

Ho un gruppo di pulsanti di opzione con lo stesso nome, ma valori diversi. Mi piacerebbe fare qualcosa di simile:

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

Questo funziona, ma quando clicco su un nuovo pulsante di opzione myfunction viene chiamato due volte: una volta per il pulsante di opzione "vecchio" che sta ottenendo automaticamente senza controllo, e una volta per quello nuovo su cui sto facendo clic.

cambiare onchange a onclick non è una soluzione, perché lo uso con jquery-mobile e avvolge gli input con l'etichetta, quindi l'etichetta viene cliccata, non l'input.

Answer 1

È possibile passare $(this) come argomento per myfunction e poi dentro myfunction controllo se il pulsante di opzione è selezionata

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

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

Answer 2

Per quanto ne so, non si dispone di alcuna restrizione per utilizzare onclick evente con jquery in un'etichetta. Se hai un ID, puoi usarlo. Diciamo che avete il seguente codice 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" > 

In te jQuery si potrebbe aggiungere:

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

Lo stesso vale per l'etichetta l'altra del pulsante di scelta

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

Spero che questo aiuti. Luis M.

Answer 3

ne dite di provare qualcosa di simile:

<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> 

E poi:

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

Questo dovrebbe chiamare la funzione solo una volta in quanto è contenuta all'interno dell'elemento che ha bisogno di usi esso.

Answer 4

Fa questo lavoro per te? A seguito del jQM Docs

• Example 1
• Example 2 (divertente)

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 
});