JS untuk memaparkan nilai peluncur julat HTML berfungsi dengan baik untuk item pertama (A1). Walau bagaimanapun, saya juga mahu menggunakannya untuk projek A2 (sebenarnya ada 20 projek, jadi ia perlu digunakan semula sebanyak 19 kali). Adakah terdapat cara untuk kod untuk berbilang lelaran?
const slideValue = document.querySelector("span"); const inputSlider = document.querySelector("input"); inputSlider.oninput = (()=>{ let value = inputSlider.value; slideValue.textContent = value; slideValue.style.left = (value/.1) + "%"; slideValue.classList.add("show"); }); inputSlider.onblur = (()=>{ slideValue.classList.remove("show"); });
A1. Blah Blah Blah.010A2. Blah Blah Blah.010
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
Sudah tentu. Anda akan mengenali kod anda sendiri dengan mudah, yang dibungkus dalam gelung for.
var elems = document.querySelectorAll(".range"); elems.forEach(function(elem) { const slideValue = elem.querySelector("span"); const inputSlider = elem.querySelector("input"); inputSlider.oninput = (() => { let value = inputSlider.value; slideValue.textContent = value; slideValue.style.left = (value / .1) + "%"; slideValue.classList.add("show"); }); inputSlider.onblur = (() => { slideValue.classList.remove("show"); }); })