Показать значение слайдера chaing в консоли - PullRequest
0 голосов
/ 07 апреля 2020

У меня есть ползунок и диапазон, которые отображают значение изменяющегося значения следующим образом:

var slider = document.getElementById("myRange");
var output = document.getElementById("dynamicSet");
output.innerHTML = slider.value; // Display the default slider value

// Update the current slider value (each time you drag the slider handle)
let update = () => output.innerHTML = slider.value;

slider.addEventListener('input', update);
update();
const setAmount = document.getElementById("dynamicSet").innerHTML;
console.log(setAmount);
<div class="slidecontainer">
    <p>Aantal sets: <span id="dynamicSet"></span></p>
    <input type="range" min="1" max="10" value="50" class="slider" id="myRange">
</div>

На веб-странице отображается изменяющееся значение, которое прекрасно работает! Однако, когда я пытаюсь записать его в консоль, он просто показывает начальное значение, на котором находится слайдер. Я пытаюсь передать sh это значение в БД (с кликом c кнопки отправки), но я заметил, что при открытии страницы значение осталось таким же, как в исходном:

enter image description here

Мне также нужно изменить внутреннее значение. Как это можно сделать? я думал, что даже слушатель уже позаботился об этом ..

Ответы [ 2 ]

1 голос
/ 07 апреля 2020

пожалуйста, проверьте это, надеюсь, это будет работать: -)

var slider = document.getElementById("myRange");
var output = document.getElementById("dynamicSet");
var isShow = true
output.innerHTML = slider.value
update=()=>{

output.innerHTML = slider.value; 
// Display the default slider value
console.log(slider.value)
}

// Update the current slider value (each time you drag the slider handle)
//let update = () => output.innerHTML = slider.value;

slider.addEventListener('input', update);
<div class="slidecontainer">
    <p>Aantal sets: <span id="dynamicSet"></span></p>
    <input type="range" min="1" max="10" value="50" class="slider" id="myRange">
</div>
0 голосов
/ 07 апреля 2020

Вы можете попробовать это

let update = () => {
  output.innerHTML = slider.value;
  console.log(slider.value)
}
...