Question

我有这段代码here及以下......

但如何使用jquery流畅地显示输入范围的值？现在它可以工作，但它不是很流利。谢谢你的帮助。

JS：

$("#price").change(function () {                    
   var newValue = $('#price').val();
   $("#valuePrice").html(newValue);
    $('#block').css({'margin-left':+newValue});
});

HTML：

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

Answer 1

处理＆＃34;输入＆＃34;事件：

$("#price").on("input", function () {                    
...
});

Answer 2

你可以使用mousemove

$("#price").on('change mousemove',function () {                    
   var newValue = $(this).val();
   $("#valuePrice").html(newValue);
    $('#block').css({'margin-left':+newValue});
});

SEE DEMO

如何使用jquery流畅地显示输入范围的值？

2 个答案: