我在表单中使用 jQuery 滑块作为价格范围选择器。我希望在更改其中一个值时自动提交表单。我使用了我在 SO 上找到的几个示例,但它们不适用于我的代码。
<form action="itemlist.php" method="post" enctype="application/x-www-form-urlencoded" name="priceform" id="priceform" target="_self">
<div id="slider-holder">
Prices: From <span id="pricefromlabel">100 €</span>
To <span id="pricetolabel">500 €</span>
<input type="hidden" id="pricefrom" name="pricefrom" value="100" />
<input type="hidden" id="priceto" name="priceto" value="500" />
<div id="slider-range"></div>
<input name="Search" type="submit" value="Search" />
</div>
</form>
这是显示滑块值并更新我用来存储价格以提交的 2 个隐藏表单字段的代码:
<script>
$(function() {
$("#slider-range" ).slider({
range: true,
min: 0,
max: 1000,
values: [ <?=$minprice?>, <?=$maxprice?> ],
start: function (event, ui) {
event.stopPropagation();
},
slide: function( event, ui ) {
$( "#pricefrom" ).val(ui.values[0]);
$( "#priceto" ).val(ui.values[1]);
$( "#pricefromlabel" ).html(ui.values[0] + ' €');
$( "#pricetolabel" ).html(ui.values[1] + ' €');
}
});
return false;
});
</script>
我尝试将此代码以及 data-autosubmit="true" 属性添加到 div 但没有结果。
$(function() {
$('[data-autosubmit="true"]').change(function() {
parentForm = $(this).('#priceform');
clearTimeout(submitTimeout);
submitTimeout = setTimeout(function() { parentForm.submit() }, 100);
});
我也尝试向滑块添加一个 $.post() 事件,但我对 jQuery 不是很好,所以我可能做错了。任何帮助将不胜感激。