我在寻找一个广义解。

考虑具有相同名称的2个无线电类型输入。当提交时,被选中的值决定随表单一起发送的值:

<input type="radio" name="myRadios" onchange="handleChange1();" value="1" />
<input type="radio" name="myRadios" onchange="handleChange2();" value="2" />

取消选择单选按钮时,更改事件不会触发。因此,如果值="1"的无线电已经被选中,而用户选择了第二个,则handleChange1()不会运行。这就出现了一个问题(至少对我来说),因为我无法捕捉到这种去选择。

我想要的是一个变通的onChange事件的复选框组值,或者,一个onCheck事件,不仅检测单选按钮是选中的,而且当它是未选中的。

我相信你们中的一些人以前遇到过这个问题。有什么变通办法(或者理想情况下,什么是处理这个问题的正确方法)?我只是想捕捉变化事件,访问以前检查的收音机以及新检查的收音机。

注: onClick似乎是一个更好的(跨浏览器的)事件来指示选中单选按钮,但它仍然不能解决未选中的问题。

我认为这是有意义的,为什么onChange复选框类型在这样的情况下工作,因为它改变了它提交的值,当你勾选或取消勾选它。我希望单选按钮表现得更像一个SELECT元素的onChange,但你能做什么…


当前回答

This is just off the top of my head, but you could do an onClick event for each radio button, give them all different IDs, and then make a for loop in the event to go through each radio button in the group and find which is was checked by looking at the 'checked' attribute. The id of the checked one would be stored as a variable, but you might want to use a temp variable first to make sure that the value of that variable changed, since the click event would fire whether or not a new radio button was checked.

其他回答

这对我很有用

<input ID="TIPO_INST-0" Name="TIPO_INST" Type="Radio" value="UNAM" onchange="convenio_unam();">UNAM

<script type="text/javascript">
            function convenio_unam(){
                if(this.document.getElementById('TIPO_INST-0').checked){
                    $("#convenio_unam").hide();
                }else{
                    $("#convenio_unam").show(); 
                }                               
            }
</script>
<input type="radio" name="brd" onclick="javascript:brd();" value="IN">   
<input type="radio" name="brd" onclick="javascript:brd();" value="EX">` 
<script type="text/javascript">
  function brd() {alert($('[name="brd"]:checked').val());}
</script>

如图所示: http://www.w3schools.com/jsref/event_onchange.asp 单选按钮不支持onchange属性。

您链接的第一个SO问题给出了答案:使用onclick事件,并检查它触发的函数内部的单选按钮状态。

博士Tl;

'focusout'在'change'事件之前被分派-示例:

const radioName = 'radio';

// Add radios
document.body.innerHTML = `
<style>
input + label {
  margin-left: 1rem;
}
</style>
<form action="#" name="example-form">
  <fieldset>
    ${Array(5).fill(null, 0, 5).map((_, i) => {
        const offsetId = i + 1;
        const id = `radio-${offsetId}`;
        return `<label for="${id}">Radio ${offsetId}</label>
        <input type="radio" name="${radioName}" id="${id}" value="${offsetId}" />`;
      }).join('\n')}
  </fieldset>
</form>
`;

const {log} = console,

    form = document.forms['example-form']; 

form.addEventListener('submit', e => e.preventDefault());

form.addEventListener('change', e => {
    const {target} = e;
    if (target.matches(`[type="radio"][name="${radioName}"]`)) {
        log(`[${e.type}]: "${target.id}" selected;  Value: ${target.value}`);
    }
});

form.addEventListener('focusout', e => {
    const {target} = e,

        soonToBePrevValue = target && target.form ? 
            target.form.elements[radioName].value : null;
    
    if (!target.matches(`[type="radio"][name="${radioName}"]`) || !soonToBePrevValue) {
        return;
    }

    // value, for '[name="radio"]', contained in form, will change after 'focusout' event
    // has completed it's bubbling stage.
    log(`[${e.type}]: previously selected radio value: ` + 
        `${soonToBePrevValue}`);
        
    // log("Soon to be \"previous\" radio: ", target);
});

斯菲德尔

This is just off the top of my head, but you could do an onClick event for each radio button, give them all different IDs, and then make a for loop in the event to go through each radio button in the group and find which is was checked by looking at the 'checked' attribute. The id of the checked one would be stored as a variable, but you might want to use a temp variable first to make sure that the value of that variable changed, since the click event would fire whether or not a new radio button was checked.