jquery-ui滑塊更改值測量

Question

在我的應用程序中，我使用的是jquery-ui滑塊。用戶可以將滑塊的值從1（月）改爲60（月）。其實1-60是幾個月。根據11日後的新要求，滑塊的值應改爲1（年），2（年）等。我的關注點如下，我可以使用這種滑塊來改變數值測量嗎？如果是，請給我舉個例子。

這是我的資料來源。

$(".slider").slider({ 
     animate: true, 
     range: "min", 
     value: 1, 
     min: 1, 
     max: 60, 
     step: 1 
}); 

Answer 1

雖然這是不可能的開箱，

我已經做了工作搗鼓你在這裏http://jsfiddle.net/JFJKP/

HTML：

<div class="slider"></div> 
<br/> 
<div class='showAltValue'>Click to Show Alt Value</div> 

JS：

$(".slider").slider({ 
    animate: true, 
    range: "min", 
    value: 1, 
    min: 1, 
    max: 60, 
    altValue: 'Nothing Selected', 
    step: 1, 
    change: function (event, ui) { 
     value = ui.value; 
     years = Math.floor(value/12); 
     months = value % 12 // value modulus of 12 gives remainder 

     if (years > 1) { 
      yearString = 'years'; 
     } else { 
      yearString = 'year'; 
     } 

     if (months > 1 && months != 0) { 
      monthString = 'months'; 
     } else { 
      monthString = 'month'; 
     } 
     // Now format the output. 
     if (years == 0) { 
      altValue = months + ' ' + monthString; 
     } else { 
      if (months == 0) { 
       //dont' show months 
       altValue = years + ' ' + yearString; 
      } else { 
       altValue = years + ' ' + yearString + ' ' + months + ' ' + monthString; 
      } 
     } 
     // Now alert the altValue 
     alert(altValue); 
     // You can now use this as a label Value somewhere and even store it as a slider attribute as such 
     $(event.target).slider("option", "altValue", altValue); 
    } 
}); 

$('.showAltValue').click(function() { 
    alert($('.slider').slider("option", "altValue")); 
}); 

這應該至少讓你走上正軌。