jquery - 为 jQuery UI 垂直滑块设置动态值

Question

我有一系列图像，我想使用滑块在这些图像之间浏览。当我打开系列时，我想为滑块设置一些值，但我无法使其工作。

我有两个问题： - 如何访问滑块 - 如何设置值

这就是我尝试的方式：

$(slider).slider({
            orientation: "vertical",
        }).addClass("dhSlider");



$(slider).slider( "option", "max", this.series.images.length);
$(slider).slider( "option", "min", 0 );
$(slider).slider( "option", "step",this.series.images.length);

Answer 1

您没有正确初始化滑块。您需要提供您想要作为滑块的 div 的类或 id：

HTML：

<p>
<label for="amount">Slider Range:</label>
<input type="text" id="amount" style="border: 0; color: #f6931f; font-weight: bold;" />
</p>

<div id="myslider" style="height: 200px;"></div>

脚本：

  <script>
 $(function() {
 $( "#myslider" ).slider({
  orientation: "vertical",
  min: 0,
  max: 100,
  range: true,
  values: [ startvalueselected, endvalueselected],
  slide: function( event, ui ) {
    $( "#amount" ).val( "$" + ui.values[ 0 ] + " - $" + ui.values[ 1 ] );
  }
 });
  $( "#amount" ).val( "$" + $( "#myslider" ).slider( "values", 0 ) +
  " - $" + $( "#myslider" ).slider( "values", 1 ) );
 });
 </script>

见 JqueryUI 垂直滑块