значение не задано в управлении слайдером html

Question

О типе ввода диапазона в HTML Когда я изменяю значение в слайдере (тип ввода диапазона), это значение отображается в текстовом поле Но когда я тоже то же самое в значении изменения в текстовом поле, он не установлен это значение в слайдере (тип ввода диапазона). Вот код Функция для него: мы также хотим, чтобы, когда мы передвиньте ползунок, а также значение изменится в текстовое поле слишком функция:

<script type="text/javascript"> 
function updateTextInput(val) { 
document.getElementById('textInput').value=val; 
} 
function updateTextInput2(val) { 
document.getElementById('range1').value = val; 
} 
</script> 

HTML:

<input type="range" min="0" max="100" value="0" id="range1"  onchange="updateTextInput(this.value);"/> 
    <input type="text" id="textInput" value="0"  onchange="updateTextInput2(this.value);"> 

Answer 1

Отладка updateTextInput для проверки установленного значения,

или попробуйте

document.getElementById ('textInput'). Value = document.getElementById ('range1'). Value;

Answer 2

Вам необходимо изменить событие, когда функция вызывается в текстовом поле из OnChange к oninput. Событие onchange срабатывает только после того, как управление теряет фокус, то есть когда пользователь нажимает на что-то другое. Событие oninput запускается каждый раз, когда пользователь меняет значение в текстовом поле.

Ваш код должен выглядеть следующим образом:

<input type="range" min="0" max="100" value="0" id="range1" onchange="updateTextInput(this.value);" /> 
<input type="text" id="textInput" value="0" oninput="updateTextInput2(this.value);"> 

Ваши функции JavaScript работать 100% штраф.

Вот рабочий пример на codepen.