Как мне отобразить значение рядом с типом ввода диапазона HTML5?

#html #printing #input

#HTML #печать #ввод

Вопрос:

Хорошо, поэтому я пытаюсь использовать диапазон для типа ввода

 Times: <input type="range" name ="times"><br>
 

Но я хочу, чтобы значение было напечатано рядом с ним, как я могу это сделать?

Нравится

——-*— 7

*——— 1

Ответ №1:

присоедините к нему событие onChange, и в функции обработчика событий вы можете выбрать значение и записать его как innerHTML в диапазон рядом с контроллером

 <input id="mine" type="range" min="-100" max="100" value="0" step="10" onChange="change();"> <span id="result"></span>

<script>
var result = document.getElementById("result");
var mine = document.getElementById("mine");
function change(){
    result.innerText = mine.value;
}
</script>
 

Комментарии:

1. Вы выполняете getElementById запрос для обоих элементов каждый раз , когда вызывается обработчик? Действительно ?!

2. Это совершенно нормально. Вы всегда можете установить объект, но тогда вам придется искать его каждый раз и проверять, установлен ли он, намного больше кода, чтобы передать простую концепцию.

3. это был быстрый пример для разработки идеи, конечно, выполнение такой вещи в коде приведет к трате ресурсов

Ответ №2:

 function showCount(){
    var count = document.getElementById("slider").value;
    console.log("meter position : " count);
}

<input type="range" value="0" id="slider" step="1" min="0" max="15" onchange="showCount()"/>
 

Это даст счетчик, когда вы переместите ползунок enter code here или поместите и предупредите.