从输入设置jQuery UI滑块的初始值

Question

我想概括一些滑块代码，以便它可以使用一些输入+滑块组合。

我有一切基本上工作 - 滑动滑块，输入值更新或输入一个数字，滑块移动到正确的位置。

但是，我无法从输入的默认值初始化滑块。这里是我的代码如下所示：

的Javascript

$(".slider").slider({ 
     min: 0, 
     max: 5, 
     value: $(this).parent().find(".inputNumber").val(), 
     step: 0.25, 
     slide: function (event, ui) { 
      $(this).parent().find(".inputNumber").val(ui.value); 
     } 
    }); 

HTML

<div class="inputWrap hidden"> 
    <input class="mini inputNumber" type="text" value="0.5"> 
    <div class="slider"></div> 
    </div> 

Answer 1

这对我的作品（与任意数量的滑块）：

$(".slider").slider({ 
    min: 0, 
    max: 5, 
    step: 0.25, 
    slide: function (event, ui) { 
     $(this).parent().find(".inputNumber").val(ui.value); 
    }, 
    create: function(event, ui){ 
     $(this).slider('value',$(this).parent().find(".inputNumber").val()); 
    } 
}); 

演示：http://jsfiddle.net/darkajax/uv5aC/

Answer 2

这似乎工作

$(".slider").each(function(){ 
    $(this).slider({ 
    min: 0, 
    max: 5, 
    step: 0.25, 
    slide: function (event, ui) { 
     $(this).parent().find(".inputNumber").val(ui.value); 
    } 
}).slider("option", "value", $(this).parent().find(".inputNumber").val()); 
}); 

FIDDLE