JavaScript - スライダーの情報を取得する

スライダーの情報の取得

/* HTML側 */
<input type="range" id="rangeid" min="0" max="100" value="50" />

/* JavaScript 側 */
var range = document.getElementById("rangeid");

// 現在の値
console.log(range.value);
スライダーの情報の取得

スライダーの変更の検知

/* HTML側 */
<input type="range" id="rangeid" min="0" max="100" value="50" />

/* JavaScript 側 */
var range = document.getElementById("rangeid");

// 状態が変化したときにイベントが発生
range.addEventListener('input', (event) => {
  // 処理内容
});
スライダーの変更の検知

関連記事