私はこれに対する一般的な解決策を探しています。
同じ名前のラジオ タイプの入力が 2 つあるとします。送信時に、チェックされている方によって、フォームで送信される値が決まります。
<input type="radio" name="myRadios" onchange="handleChange1();" value="1" />
<input type="radio" name="myRadios" onchange="handleChange2();" value="2" />
ラジオ ボタンの選択が解除されると、変更イベントは発生しません。したがって、ラジオ ボタンがvalue="1"すでに選択されていて、ユーザーが 2 番目を選択した場合は、handleChange1()実行されません。この選択解除をキャッチできるイベントがないため、これは (少なくとも私にとっては) 問題となります。
私が欲しいのは、onChangeチェックボックス グループ値のイベントの回避策、またはonCheckラジオ ボタンがオンになっているときだけでなくオフになっているときも検出するイベントです。
皆さんの中には、この問題に遭遇したことがある人もいると思います。回避策はありますか (または、理想的には、この問題を処理する正しい方法は何ですか)? 変更イベントをキャッチし、以前にチェックされたラジオと新しくチェックされたラジオにアクセスしたいだけです。
PS は
onClick、ラジオ ボタンがチェックされていることを示すためのより優れた (クロス ブラウザーの) イベントのように見えますが、チェックされていない問題は解決されません。
onChangeチェックボックス タイプがこのような場合に機能するのは、チェックを入れたり外したりすると送信される値が変わるため、理にかなっていると思います。ラジオ ボタンが SELECT 要素のように動作すればいいのですonChangeが、どうしたらよいでしょうか...
ベストアンサー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>JSFiddle のデモはこちらです:https://jsfiddle.net/crp6em1z/