在 Firefox 中拖动时，输入类型=范围上的 onchange 事件不会触发

当我玩的时候<input type="range">，只有当我们将滑块放到新位置时，Firefox 才会触发 onchange 事件，而 Chrome 和其他浏览器在拖动滑块时会触发 onchange 事件。

如何在 Firefox 中拖动时实现此效果？

function showVal(newVal){
    document.getElementById("valBox").innerHTML=newVal;
}

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

显然 Chrome 和 Safari 是错误的：onchange仅应在用户释放鼠标时触发。要获得持续更新，您应该使用oninput事件，它将通过鼠标和键盘捕获 Firefox、Safari 和 Chrome 中的实时更新。

然而，oninputIE10 不支持，因此最好的选择是将两个事件处理程序结合起来，如下所示：

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

看看这个Bugzilla 线程 https://bugzilla.mozilla.org/show_bug.cgi?id=853670了解更多信息。