Отображение значения поля диапазона при изменении с помощью jQuery

Question

У меня есть это поле диапазона, и рядом с ним находится значение по умолчанию 300 фунтов стерлингов.

<div class="filterField">
<label>Price:</label>
<input type="range" name="price" id="price" min="0" max="1000" value="300" />
<div class="rangeValue"><div id="valuePrice">300</div> GBP</div>
</div>

Теперь я пытаюсь изменить значение в <div id="valuePrice"></div> мгновенно, когда пользователь делаетизменить.

Я пробовал это с этим сценарием, но он не работает:

$("#price").change(function () {                    
   var newValue = $('#price').val();
   $("#valuePrice").replaceWith(newValue);
});

Кто-то может помочь мне с этим?

Answer 1

Вы пробовали:

$("#valuePrice").html(newValue);

Answer 2

событие изменения запускается, когда текстовое поле размыто. Вы можете использовать событие keyup, если хотите, чтобы div обновлялось мгновенно при вводе пользователем:

$("#price").keyup(function () {                    
   var newValue = $('#price').val();
   $("#valuePrice").html(newValue);
});