如何用jquery监听输入类型范围?
How to listen to input type range with jquery?
我正在尝试通过 ajax 在用户交互时通过更改 jquery 移动范围 min/max 滑块来加载一些数据。
<label for="filter_price">Preis:</label>
<div data-role="rangeslider" id="filter_price" style="touch-action: none;">
<input type="range" name="price_from" id="price_from" min="1" max="2000" value="1" data-popup-enabled="true" class="filter_watch">
<input type="range" name="price_to" id="price_to" min="1" max="20000" value="20000" data-popup-enabled="true" class="filter_watch">
</div>
js:
$('#price_from').on("change mousemove", function
() {
alert('price filter');
})
https://jsfiddle.net/28avj4x5/
在 jsfiddle 上,每次鼠标移动都会触发警报,而只有 chagne 应该触发。在我的项目中,事件根本不会触发。我也试过 change.(function...
没有任何效果。
如何在更改值和释放按钮时触发事件(ajax 调用仅在用户停止交互时触发的方式)?
slidestop
事件专门为此设计:
$(document).on("slidecreate", "#price_from", function(e) {
$(this).on("slidestop", function() {
var val = $(this).val();
// pass val to the ajax call
});
});
在我的代码片段中尝试一下:
我正在尝试通过 ajax 在用户交互时通过更改 jquery 移动范围 min/max 滑块来加载一些数据。
<label for="filter_price">Preis:</label>
<div data-role="rangeslider" id="filter_price" style="touch-action: none;">
<input type="range" name="price_from" id="price_from" min="1" max="2000" value="1" data-popup-enabled="true" class="filter_watch">
<input type="range" name="price_to" id="price_to" min="1" max="20000" value="20000" data-popup-enabled="true" class="filter_watch">
</div>
js:
$('#price_from').on("change mousemove", function
() {
alert('price filter');
})
https://jsfiddle.net/28avj4x5/
在 jsfiddle 上,每次鼠标移动都会触发警报,而只有 chagne 应该触发。在我的项目中,事件根本不会触发。我也试过 change.(function...
没有任何效果。
如何在更改值和释放按钮时触发事件(ajax 调用仅在用户停止交互时触发的方式)?
slidestop
事件专门为此设计:
$(document).on("slidecreate", "#price_from", function(e) {
$(this).on("slidestop", function() {
var val = $(this).val();
// pass val to the ajax call
});
});
在我的代码片段中尝试一下: