javascript - ejemplos - onclick jquery html

Usando JQuery, ¿cuál es la mejor manera de configurar los detectores onclick para los botones de opción?

Question

Para el siguiente HTML:

<form name="myForm">
<label>One<input name="area" type="radio" value="S" /></label>
<label>Two<input name="area" type="radio" value="R" /></label>
<label>Three<input name="area" type="radio" value="O" /></label>
<label>Four<input name="area" type="radio" value="U" /></label>
</form>

Cambiando del siguiente código de javascript:

$(function() {
var myForm = document.myForm;
var radios = myForm.area;
// Loop through radio buttons
for (var i=0; i<radios.length; i++) {
if (radios[i].value == "S") {
radios[i].checked = true; // Selected when form displays
radioClicks(); // Execute the function, initial setup
}
radios[i].onclick = radioClicks; // Assign to run when clicked
}
});

Gracias

EDIT: la respuesta que seleccioné responde la pregunta que hice, sin embargo me gusta la respuesta que usa bind () porque también muestra cómo distinguir el grupo de botones de radio

Answer 1

Creo que algo como esto debería funcionar (pero no se ha probado):

$("input[@type=''radio'']").each(function(i) {
if (this.val() == ''E'') {
radioClicks();
this.get().checked = true;
}
}
$("input[@type=''radio'']").click(radioClicks);

Answer 2

$(function() {
$("form#myForm input[type=''radio'']").click( fn );
});
function fn()
{
//do stuff here
}

Answer 3

$(function() {
$(''#myForm :radio'').each(function() {
if ($(this).value == ''S'') {
$(this).attr("checked", true);
radioClicks();
}
$(this).click(radioClicks);
});
});

Answer 4

$(function() {
$(''input[@type="radio"]'').click(radioClicks);
});

Answer 5

$( function() {
$("input:radio")
.click(radioClicks)
.filter("[value=''S'']")
.attr("checked", "checked");
});

Answer 6

$(document).ready(function(){
$("input[name=''area'']").bind("click", radioClicks);
});
functionradioClicks() {
alert($(this).val());
}

Me gusta usar bind() lugar de cablear directamente el controlador de eventos porque puede pasar datos adicionales al controlador de eventos (no se muestra aquí pero los datos son un tercer argumento bind ()) y porque puede desvincularlo fácilmente (y puede enlazar y desvincular por grupo - ver los documentos de JQuery).

http://docs.jquery.com/Events/bind#typedatafn