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")); 
}); 

这应该至少让你走上正轨。