を操作してみたところ<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)">
ベストアンサー1
どうやら Chrome と Safari は間違っています。onchange
ユーザーがマウスを離したときにのみトリガーされる必要があります。継続的な更新を取得するには、oninput
マウスとキーボードの両方から Firefox、Safari、Chrome でライブ更新をキャプチャするイベントを使用する必要があります。
ただし、oninput
IE10 ではサポートされていないため、次のように 2 つのイベント ハンドラーを組み合わせるのが最善策です。
<span id="valBox"></span>
<input
type="range"
min="5"
max="10"
step="1"
oninput="showVal(this.value)"
onchange="showVal(this.value)"
/>
これをチェックしてくださいBugzilla スレッド詳細については。