ブラウザ間でラジオ ボタン グループの変更を確実に追跡する方法

ラジオ ボタン グループの Change イベントのクロスブラウザ ソリューション

複数の入力が同じ名前を共有するラジオ ボタン グループでは、onChange イベント変更の追跡に関しては信頼できない可能性があります。これは、ラジオ ボタンの選択が解除されている場合、onChange が起動しないためです。

回避策: イベントの委任と状態管理

回避策の 1 つは、イベントの委任と状態管理を使用することです。以前にチェックしたラジオ ボタンを追跡します。ラジオ ボタンを含むフォームに単一のイベント リスナーを追加することで、すべての変更イベントをキャプチャし、それに応じて状態を更新できます。

<code class="javascript">var rad = document.myForm.myRadios;
var prev = null;

for (var i = 0; i <p>このスクリプトは、各ラジオ ボタンに変更イベント リスナーを割り当てます。変更が発生すると、現在チェックされているラジオ ボタンを参照するように「prev」変数を更新する前に、以前にチェックされたラジオ ボタン (存在する場合) の値をログに記録します。</p>
<p><strong>代替アプローチ</strong></p>
<ul>
<li>直接イベント委任の代わりにイベント バブリングを使用できます。このアプローチでは、イベント リスナーがフォーム要素に追加され、ラジオ ボタンがクリックされるとイベントがフォームにバブルアップされます。ただし、このアプローチはパフォーマンスに影響を与える可能性があります。</li>
<li>クリック イベントは、onChange のフォールバックとして使用できます。クリック イベントは、ラジオ ボタンがオンかオフかに関係なくトリガーされますが、ラジオ ボタン グループの状態のコンテキストが欠落しています。</li>
</ul></code>

以上がブラウザ間でラジオ ボタン グループの変更を確実に追跡する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。