UIスライダ - 複数の位置を保存する

Question

jQuery UIスライダを使用していますが、複数のスライダを使用しているときにスライダの位置を保存できません。

マークアップ：

<label for="amount">Selected Value:</label> 
<input type="text" class="amount" name="mytheme_options[' . $id . ']" value="' . esc_attr($options[$id]) . '" /> 
<div class="slider"></div> 

JS：

jQuery(document).ready(function() { 
     var position = jQuery('.slider').prev('input').val(); //cache the position of the slider so we can recall that on page reload 

     jQuery(".slider").slider({ 
      value: position, 
      min: 0, 
      range: "max", 
      max: 500, 
      step: 50, 
      slide: function(event, ui) { 
       jQuery(this).prev(".amount").val(ui.value); 
      } 
     }); 
}); 

一つだけ存在する場合、スライダのpostionを設定するため正常に動作しますもちろん、それ。しかし、私は "value"要素に適切なメッシュを書くのに問題があります。

これは機能しますが、サイコロはありません。

value: function(event, ui) { 
       jQuery(this).prev('.amount').val(); 
      } 

Answer 1

あなたは.each()を行うことができ、その後、あなたはjQuery(this)にアクセスできなければなりません：

jQuery(document).ready(function() { 
    jQuery(".slider").each(function() { 
     jQuery(this).slider({ 
      value: jQuery(this).prev('.amount').val(), 
      min: 0, 
      range: "max", 
      max: 500, 
      step: 50, 
      slide: function(event, ui) { 
       jQuery(this).prev(".amount").val(ui.value); 
      } 
     }); 
    }); 
}); 

http://jsfiddle.net/jtbowden/KZWTs/