javascript - 使用 jQuery，为单选按钮设置 onClick 事件监听器的最佳方法是什么？

Question

对于以下 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>

从以下 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
     }  
 });

谢谢

编辑:我选择的响应回答了我提出的问题，但是我喜欢使用 bind() 的答案，因为它还显示了如何区分单选按钮组

Answer 1

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

functionradioClicks() {
    alert($(this).val());
}

我喜欢使用 bind() 而不是直接连接事件处理程序，因为您可以将额外的数据传递给事件处理程序(此处未显示，但数据是第三个 bind() 参数)并且因为您可以轻松地解除绑定(bind)(并且您可以按组绑定(bind)和解除绑定(bind)——请参阅 jQuery 文档)。

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