javascript - スライダーのjquery uiスライダー値

Question

以下を超えて、スライダー自体のハンドルにスライダーの値を入れるための既存の解決策を誰かが持っているかどうか、私は興味があります:

    $( "#slider-vertical" ).slider({
        orientation: "vertical",
        range: "min",
        min: 0,
        max: 100,
        value: 60,
        slide: function( event, ui ) {
            $( "#amount" ).val( ui.value );
            $(this).find('.ui-slider-handle').text(ui.value);
        }

注: これはスライダーの初期値を設定しませんが、実行する必要があることは承知しています。

Answer 1

これを試して

​$(function(){
    $( "#slider-vertical" ).slider({
        orientation: "vertical",
        range: "min",
        min: 0,
        max: 100,
        value: 60,
        slide: function( event, ui ) {
            $( "#amount" ).val( ui.value );
            $(this).find('.ui-slider-handle').text(ui.value);
        },
        create: function(event, ui) {
            var v=$(this).slider('value');
            $(this).find('.ui-slider-handle').text(v);
        }
    });    
});​

デモ。

Answer 2

範囲スライダーを使用して各スライダーを個別に設定している場合の更新

$("#slider-vertical").slider({
        range: true,
        min:0,
        max:500,
        values:[1,300],
        slide: function( event, ui ) {
            $(ui.handle).text(ui.value);
        },
        create: function(event, ui) {
            var v = $(this).slider('values');
            var c = 0;
            $(this).find('.ui-slider-handle').each(function(){
                $(this).first().text(v[c]);
                c++;
            });
        }   
});