25

私は ui.slider を持っていて、実行時に最小値と最大値を変更します。しかし、これらの変更は、後で値を設定したときにのみビューに反映されます (これにより、不要なイベントが発生します)。私の意見では、最小値と最大値も設定した後にビューを更新する必要があります。簡単な回避策はありますか、スライダーの更新方法がないようです。

$("#something").slider({
    range: true,
    values: [25, 75],
    min: 0,
    max: 100
});
$("#something").slider("option", "min", 25); // left handle should be at the left end, but it doesn't move
$("#something").slider("option", "values", [25, 75]); // the left handle is now at the left end, but doing this triggers events

編集この問題は jQuery UI 1.9 で修正されました

4

8 に答える 8

29

これがjQuery UIスライダーのバグかどうかはわかりませんが、とにかく、現在の値を変更して（技術的には現在の値を現在の値に設定する...）、ビューを強制的に更新することができます。 . ドキュメントに従うと、これは次のようなことを意味します。

$(function() { 
    var $slide = $("#something").slider({
        range: true,
        values: [25, 75],
        min: 0,
        max: 100
    });
    $slide.slider("option", "min", 25); // left handle should be at the left end, but it doesn't move
    $slide.slider("value", $slide.slider("value")); //force the view refresh, re-setting the current value
});
于 2011-06-13T18:52:58.507 に答える
2

ハンドルの再配置の問題を解決しました...この関数を呼び出すだけです..

function resetSlider(){
    $("#slider-fill").attr('value',maxPrice);
    $("input[type='range']").slider( "refresh" );//refresh slider to max value
    $(".ui-slider-handle").css("left","100%");
    console.log("Slider Reset Done.");
}
于 2012-04-09T07:27:50.393 に答える
1

スライダーの最小値を次のように設定します。

$slide.slider("option", "min", 25);私にはうまくいきません。

代わりに: を使用$slide.slider("values", "0", 25);しましたが、すべて正常に動作しています。

スライダーの最大値を設定するには、$slide.slider("values", "1", 75);

値の設定の詳細については、API ドキュメント ( http://api.jqueryui.com/slider/#option-values ) を参照してください。

于 2014-08-12T06:29:25.900 に答える
0

バージョンの問題である可能性がありますが、オプション「最小/最大」で試したものは何も機能しませんでした。これは問題なく、JQuery UI 1.10 でテストされています。このようにして、スライダーまたは数値のいずれかを使用して、もう一方を変更できます。

$("#mySlider").slider({range: true, min: 0, max: 100, values: [ 0, 100 ], step: 10,
   slide: function( event, ui ) {
      $("#mySliderMin").val( ui.values[ 0 ]);
      $("#mySliderMax").val( ui.values[ 1 ]);
   }
});
$("#mySliderMin").val($("#mySlider").slider( "values", 0 ));
$("#mySliderMax").val($("#mySlider").slider( "values", 1 ));
$("#mySliderMin, #mySliderMax").change(function () {
   $("#mySlider").slider("values", 0, $("#mySliderMin").val());
   $("#mySlider").slider("values", 1, $("#mySliderMax").val());
});
于 2014-02-25T23:50:13.077 に答える
0

これを試してください：

$("#Slider2").slider("value", 10, 1000); //10 = min and 1000 = max
于 2016-07-14T12:46:51.163 に答える
-3

スライダー オブジェクトへの参照を保持する必要があります。

var slider = $("#something").slider({
               range: true,
               values: [25, 75],
               min: 0,
               max: 100
             });
slider.slider("option", "min", 25);

これはすべてドキュメントに記載されています

于 2011-06-13T17:16:11.260 に答える