Allega listener di eventi tramite javascript al pulsante di opzione

Question

Ho diversi pulsanti di opzione con lo stesso nome. In questo modo:

Ora devo aggiungere listener di eventi tramite javascript a tutti i pulsanti di opzione. Se lo pseudocodice di seguito è sbagliato, quindi la prego di dirmi come fare it-

var radios = document.forms["formA"].elements["myradio"]; 
    for(radio in radios) { 
    radio.onclick = function() { 
     alert(radio.value); 
    } 
} 

Answer 1

Perché in loop in JavaScript restituire le chiavi, non i valori. Per ottenere il cui ciclo di lavoro, a patto di non aver aggiunto le proprietà personalizzate per l'array, faresti:

for(radio in radios) { 
    radios[radio].onclick = function() { 
     alert(this.value); 
    } 
} 

Ma si dovrebbe sempre ciclo un array con un normale ciclo for per evitare accidentalmente incluse le proprietà enumerabili aggiunte dall'utente:

var radios = document.forms["formA"].elements["myradio"]; 
for(var i = 0, max = radios.length; i < max; i++) { 
    radios[i].onclick = function() { 
     alert(this.value); 
    } 
} 

Answer 2

È possibile aggiungere un solo listener che ascolti tutti i pulsanti di opzione anziché i singoli ascoltatori.

utilizzando jQuery, si potrebbe fare così

$(document).ready(function(){ 
    $('input[type=radio]').click(function(){ 
     alert(this.value); 
    }); 
}); 

Demo

Solo per le radio all'interno di una forma con id formA

$(document).ready(function(){ 
     $('#formA input[type=radio]').click(function(){ 
      alert(this.value); 
     }); 
    }); 

Solo per le radio con un ID myradio

$(document).ready(function(){ 
    $('input[type=radio]').click(function(){ 
     if (this.id == "myradio") 
      alert(this.value); 
    }); 
}); 

Demo

Answer 3

Un buon inizio, ma non usare for..in in questo modo come sarà iterare su tutte le proprietà enumerabili e non è stato controllato per vedere se tutti rappresentano elementi.

molto meglio utilizzare un indice:

for (var i=0, iLen=radios.length; i<iLen; i++) { 
    radios[i].onclick = function() {...}; 
} 

Answer 4

for(var property in object) { ... } 

viene utilizzato per loop in oggetti per trovare immobili. per matrice è possibile utilizzare il normale ciclo for

for(var i=0; i< radios.length; i++) { 
    var radio = radios[i]; 
    .... 
}