滑動條移動時更改文字

Question

$(function() { 
    $(".sli3").slider({ 
     range: "min", 
     value: 50, 
     min: 0, 
     max: 100, 
     slide: function(event, ui) { 
      $(".sli3_f").text($(this).val( ui.value+"%")); 
     } 
    }); 
    $(".sli3_f").text($(this).val($(".sli3").slider("value")+"%")); 
}); 


<div class="sli3"><span class="sli3_f"></span></div> 

我試圖在滑動條移動時更改文字 瀏覽器上沒有任何反應。 有什麼想法？

Answer 1

我不相信$ this.val（）是必要的

$(function() { 
    $(".sli3").slider({ 
     range: "min", 
     value: 50, 
     min: 0, 
     max: 100, 
     slide: function(event, ui) { 
      $(".sli3_f").text(ui.value+"%"); 
     } 
    }); 
    $(".sli3_f").text($(".sli3").slider("value")+"%"); 
}); 


<div class="sli3"><span class="sli3_f"></span></div> 

Answer 2

你有幾個錯誤。首先，你不想使用$(this).val(...)。這只是設置$(this)的值，這不是您想要在這種情況下執行的操作。您只需要檢索當您處於滑塊對象的方法中時由ui.value提供的值。的滑塊的方法之外，你只是想$(".sli3").slider("value")：

$(function() { 
    $(".sli3").slider({ 
     range: "min", 
     value: 50, 
     min: 0, 
     max: 100, 
     slide: function(event, ui) { 
      $(".sli3_f").text(ui.value + "%"); 
     } 
    }); 

    $(".sli3_f").text($(".sli3").slider("value") + "%"); 
}); 

演示：http://jsfiddle.net/XjD4K/