Jquery - 將可變文本添加到滑塊

Question

$('#slider').slider({ 
    range: "min", 
    value: 20, 
    step: 5, 
    min: 20, 
    slide: function(event, ui) { 
     $("#amount1").val("$" + ui.value); 
    } 
}); 

這就是我現在所擁有的，它是一個顯示值的滑動條。 HTML部分如下：

<label for="amount">Offer:</label> 
<input type="text" id="amount1" /> 
<div id="slider"></div> 

我想要的是它下面有一個文本塊;除了我希望文本隨着值的增加而改變。再說了，如果它是>= 20和< 40它說"Blah1" =>40它會會說：「blah2」

但我無法添加另一個事件的滑動功能。

非常感謝您的幫助，我將能夠將它應用於很多事情。通常它只是每個腳本的一個函數，我從來沒有像這樣分層。

Answer 1

所有你應該做的是一個額外的代碼添加到現有的功能，用於評估的ui.value值：

$('#slider').slider({ 
    range: "min", 
    value: 20, 
    step: 5, 
    min: 20, 
    slide: function(event, ui) { 
     $("#amount1").val("$" + ui.value); 

     if (ui.value >= 20 && ui.value < 40) { 
      $("#message").text("greater than or equal to 20 and less than 40"); 
     } else if (ui.value >= 40) { 
      $("#message").text("greater than or equal to 40"); 
     } 
    } 
}); 

例子：http://jsfiddle.net/andrewwhitaker/WP29E/16/