jQuery滑塊的拖動控制柄/滑塊上的值

Question

我想顯示拖動控制柄（滑塊）內的滑塊的值。任何資源提供非常感謝。我正在使用jQuery 1.5.1

謝謝

Answer 1

您是否使用jQuery UI滑塊？

如果是這樣，這是一個解決方案：

$("#slider").slider({ 
    change: function() { 
     var value = $("#slider").slider("option","value"); 
     $("#slider").find(".ui-slider-handle").text(value); 
    }, 
    slide: function() { 
     var value = $("#slider").slider("option","value"); 
     $("#slider").find(".ui-slider-handle").text(value); 
    } 
}); 

jsFiddle example here

Answer 2

只是想一點點添加到答案。

如果您正在設置初始值，或者您希望文本在調用幻燈片方法之前出現在句柄上，則需要在底部添加文檔準備位，但我也已將代碼濃縮爲a小

// take value from event, ui.value 
    $("#slider1").slider({ 
     slide: function (event, ui) { 
      $("#slider").find(".ui-slider-handle").text(ui.value); 
     } 
    }); 

    // sets text initially to value of slider, even if a default value is set 
    $(document).ready(function() { 
     var value = $("#slider").slider("option","value"); 
     $("#slider").find(".ui-slider-handle").text(value); 
    }); 

Answer 3

THX所有，我有拖就不同手柄值jQuery UI的滑塊的解決方案。
示例2手柄：

用於滑動事件

$("#wt-altitude-range").slider({ 
    range: true, 
    min: 0, 
    max: 3000, 
    values: [ 100, 2500 ], 
    slide: function(event, ui) { 
     $(ui.handle).text(ui.value); 
    } 
}); 

工作。 ui.handle - 當前句柄，ui.value - 當前值。