小编典典

单选按钮的OnChange事件处理程序(INPUT type =“ radio”)不能用作一个值

javascript

我正在为此寻求一个通用的解决方案。

考虑2个具有相同名称的无线电类型输入。提交后,选中的将确定以以下形式发送的值:

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

取消选择单选按钮时,更改事件不会触发。因此,如果已经选择了值=“
1”的单选按钮,并且用户选择了第二个,则handleChange1()不会运行。这(无论如何对我而言)带来了一个问题,因为没有任何事件可以使我取消选择。

我想要的是一个针对复选框组值的onchange事件或一个oncheck事件的变通办法,该事件不仅可以检查无线电是否选中,还可以不选中无线电。

我敢肯定你们当中有些人曾经遇到过这个问题。有哪些解决方法(或者理想情况下是正确的处理方式)?我只想捕捉更改事件,访问以前检查过的收音机以及新检查过的收音机。

PS
onclick似乎是一个更好的(跨浏览器)事件,用于指示何时选中某个收音机,但仍不能解决未选中的问题。

我认为这对于在这种情况下为什么onchange的复选框类型起作用是有道理的,因为它会更改您在选中或取消选中它时提交的值。我希望单选按钮的行为更像是SELECT元素的onchange,但是您该怎么办…


阅读 483

收藏
2020-05-01

共1个答案

小编典典

var rad = document.myForm.myRadios;

var prev = null;

for (var i = 0; i < rad.length; i++) {

    rad[i].addEventListener('change', function() {

        (prev) ? console.log(prev.value): null;

        if (this !== prev) {

            prev = this;

        }

        console.log(this.value)

    });

}


<form name="myForm">

  <input type="radio" name="myRadios"  value="1" />

  <input type="radio" name="myRadios"  value="2" />

</form>
2020-05-01