javascript - 在控制台中显示更改 slider 值

Question

我有一个 slider 和跨度，它显示变化值的值，如下所示:

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>

网页显示变化的值，效果很好!但是，当我尝试控制台记录它时，它只显示 slider 所在的初始值。我试图将此值推送到数据库(使用单击提交按钮)，但我注意到打开页面时该值与初始值保持不变:

我也需要更改后端值。怎么能做到这一点呢？我以为偶听者已经解决了这个问题..

Answer 1

请检查一下，希望它能起作用:-)

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>