Question

我有两个范围滑块按租金和卧室数量过滤出租物业列表。我试图在它们上设置cookie，以便当用户通过＆＃34;返回租借回到此页面时，会记住所选值和句柄位置。链接。但是我尝试过的每一个解决方案都没有做任何事情或打破了滑块的现有功能。我是jQuery的新手，有人可以帮我一把吗？

感谢您的帮助。这是两个滑块的代码：

<form id="formBeds">
      <label for="amountBeds"># of Beds:</label>
      <input type="text" id="amountBeds" style="border:0; color:#f6931f; font-weight:bold;" />
</form>
<div class="slider" id="beds"></div>

<form id="formPrice">
  <label for="amountPrice">Rent:</label>
  <input type="text" id="amountPrice" style="border:0; color:#f6931f; font-weight:bold;" />
</form>
<div class="slider" id="price"></div>

<script>
function showProducts(minPrice, maxPrice, minBeds, maxBeds) {
$("#bedrooms li").filter(function() {
    var price = parseInt($(this).data("price"), 10);
    var beds = parseInt($(this).data("beds"), 10);
    if(price >= minPrice && price <= maxPrice && beds >= minBeds && beds <= maxBeds){
         $(this).show();
    } else {
         $(this).hide();
    }
});
}
$(function() {
var options = {
    range: true,
    min: 0,
    max: 800,
    values: [ 0, 800 ],
    change: function(event, ui) {
        var minPrice = $("#price").slider("values", 0);
        var maxPrice = $("#price").slider("values", 1);
        var minBeds = $("#beds").slider("values", 0);
        var maxBeds = $("#beds").slider("values", 1);
        $("#amountPrice").val("$" + minPrice + " - $" + maxPrice);
        $("#amountBeds").val(minBeds + " - " + maxBeds);
        showProducts(minPrice, maxPrice, minBeds, maxBeds);
    }
};
var bounds = $("#slider").slider(options, "bounds");
$("#price").slider(options, "bounds", {min: 300, max: 800});
$("#beds").slider(options, "bounds", {min: 1, max: 4});
});
</script>

在2个jQuery范围滑块上设置cookie

0 个答案: