Question

我尝试设置滑块 http://jqueryui.com/slider/#range

  <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 ) );
  } );
  </script>
</head>
<body>

<p>
  <label for="amount">Price range:</label>
  <input type="text" class="sliderJquery" id="amount" readonly style="border:0; color:#f6931f; font-weight:bold;">
</p>
<div id="slider-range"></div>

但是我无法理解如何定义这个值（当我用两个拖动控制柄更改一系列值时我会记住这个值。）以便在过滤器中使用以下内容。我尝试写这样的东西，但它不起作用

$("div[class='sliderJquery'] input").change(function(event, ui){
            leftPrice = $( "#amount" ).val(ui.values[ 0 ]);
            rightPrice = $( "#amount" ).val(ui.values[ 1 ]);
            console.log("Left: "+leftPrice);
            console.log("Right: "+rightPrice);
        });

Answer 1

通过附加＆＃34; 更改＆＃34;您可以获取滑块更改时滑块的值事件到滑块。

$( "#slider-range" ).slider({
   change: function( event, ui ) {
     // Get the value
     var leftValue = ui.values[0];
     var rightValue = ui.values[1];
  }
});

如果您想设置值：

$("#slider-range").slider('values',0,10); // sets first handle with index 0 to 10
$("#slider-range").slider('values',1,30); // sets second handle with index 1 to 30

Answer 2

此信息。记录在api中。

// Getter
var values = $( ".selector" ).slider( "option", "values" );

这会将值保存在变量values

中

如何从Jquery滑块中重新获取值

2 个答案: