為什麼 Firefox 在處理範圍輸入的「Onchange」事件時表現不同？

Firefox 中的輸入類型=Range Onchange 事件行為差異

問題陳述：

While使用，Firefox 僅在滑桿放入新位置時觸發'onchange' 事件，而Chrome 等其他瀏覽器則在拖曳操作期間啟動該事件。

解決方案：

由於「onchange」事件的不同瀏覽器實作而導致行為差異。根據 HTML 規範，「onchange」僅應在輸入欄位的值最終確定時（例如，釋放滑鼠時）執行。

要解決此差異，可以採用以下解決方案：

利用「oninput」事件，該事件捕捉滑鼠拖曳和鍵盤輸入期間的值變化，從而提供跨瀏覽器的一致行為。

但是，IE10 不支援「oninput」。因此，為了全面相容，請考慮組合「oninput」和「onchange」事件處理程序：

<code class="html"><span id="valBox"></span>
<input
  type="range"
  min="5"
  max="10"
  step="1"
  oninput="showVal(this.value)"
  onchange="showVal(this.value)"
/></code>

透過合併此方法，「onchange」事件將在Firefox、Safari 和Chrome 中一致觸發，而也確保與IE10 的兼容性。

以上是為什麼 Firefox 在處理範圍輸入的「Onchange」事件時表現不同？的詳細內容。更多資訊請關注PHP中文網其他相關文章！