單選按鈕群組中變更事件的跨瀏覽器解決方案
在多個輸入共用相同名稱的單選按鈕群組中,onChange 事件追蹤更改可能不可靠。這是因為取消選擇單選按鈕時 onChange 不會觸發。
解決方法:事件委託和狀態管理
一種解決方法是使用事件委託和狀態管理追蹤先前選取的單選按鈕。透過為包含單選按鈕的表單新增單一事件偵聽器,我們可以擷取所有變更事件並相應地更新我們的狀態:
<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中文網其他相關文章!