JQuery Range Slider

Question

您好我是JQuery的新手我在这里找到了一个滑块：JQuery Range Slider，我在我的html页面中复制了这段代码

<script>
  $(function() {
    $( "#slider-range" ).slider({
      range: true,
      min: 0,
      max: 500,
      values: [ 75, 300 ],
      slide: function( event, ui ) {
        $( "#amount" ).val( "€" + ui.values[ 0 ] + " - €" + ui.values[ 1 ] );
      }
    });
    $( "#amount" ).val( "$" + $( "#slider-range" ).slider( "values", 0 ) +
      " - €" + $( "#slider-range" ).slider( "values", 1 ) );
  });
 $( "input" ).rangeslider();
  </script>

我还把css包含在我体内的滑块div中。 如果我将滑块移动例如从10美元到30美元，它应该在我的内容中仅显示这些产品，这些产品介于此范围之间。价格在输入栏中。

希望有人可以帮助我！

Answer 1

使用$（＆＃34;＃amount＆＃34;）。val（）获取范围值，然后根据此值发出请求以获得所需的响应。

在主幻灯片功能中执行以下操作

slide: function( event, ui ) {
        $( "#amount" ).val( "$" + ui.values[ 0 ] + " - $" + ui.values[ 1 ] );

        //here make ajax call with input value 1 as ui.values[ 0 ] 
        //                                and  2 as ui.values[ 1 ] 
}