javascript - 将 onclick 事件添加到 jquery 中的单选按钮

Question

我有以下 html

<div id="test"></div>
<div id="test2">
    <input type="radio" id="RBtest1">Yes</input>
    <input type="radio" id="RBtest2">No</input>
</div>

和以下 JavaScript

    $('#RBtest1').onclick = function () {
        alert("Test");
        $('#RBtest1').prop('checked', true).checkboxradio('refresh');
        $('#RBtest2').prop('checked', false).checkboxradio('refresh');
    };

    $('#RBtest2').onclick = function () {
        $('#RBtest2').prop('checked', true).checkboxradio('refresh');
        $('#RBtest1').prop('checked', false).checkboxradio('refresh');
        $('#test').append('test');
    };

此 JavaScript 在页面加载后触发，但当我单击单选按钮时什么也没有发生。有人可以看看我在这方面哪里出了问题吗？

Answer 1

您可以使用通用名称属性来使它们成为单选:

 <input type="radio" name="r1" id="RBtest1">Yes</input>
 <input type="radio" name="r1" id="RBtest2">No</input>

更新::当您尝试将 javascript 单击事件绑定(bind)到 jquery 对象时，单击事件不起作用。您应该使用 $('#RBtest1')[0],$('#RBtest2')[0] 与 JavaScript 点击事件一起使用。或者使用jquery点击事件:

 $('#RBtest1').click(function () {
   alert("Test");
   $('#RBtest1').prop('checked', true).checkboxradio('refresh');
   $('#RBtest2').prop('checked', false).checkboxradio('refresh');
 });

 $('#RBtest2').click(function () {
   $('#RBtest2').prop('checked', true).checkboxradio('refresh');
   $('#RBtest1').prop('checked', false).checkboxradio('refresh');
   $('#test').append('test');
 );