非線性UI滑塊值/佔位符

Question

我希望我的UI滑塊位於其數組的第二個點，但當頁面加載而不是其位置（1）時，文本框顯示數組值（20）。

佔位符&值html元素似乎不工作。

我有一個方便的小提琴：here

的HTML

<div id="slider"></div> 
<input type="text" id="slider-val" value="20" /> 

jQuery的

$(function() { 
    var valMap = [10, 20, 40, 80]; 
    $("#slider").slider({ 
     range: "max", 
     max: valMap.length - 1, 
     value: 1, 
     slide: function(event, ui) { 
      if (valMap[ui.value] > 0) { 
       $("#slider-val").val(valMap[ui.value]); 
      } else { 
       $("#slider-val").val("1/" + (valMap[ui.value - 2]) * -1); 
      } 
      $(valMap[ui.value]).val($('#slider-val').val()); 
     } 
    }); 
    $("#slider-val").val($("#slider").slider("value")); 
}); 

Answer 1

將行：

$("#slider-val").val($("#slider").slider("value")); 

有：

$("#slider-val").val(valMap[$("#slider").slider("value")]); 

當你想使用滑塊值作爲valMap數組中的索引。

jsFiddle