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

如果只有一个滑块位置，那当然可以正常工作。但是，我在为“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/

UI滑块 - 保存多个位置

1 个答案: