jQuery UI Slider使用范围,奇怪的行为

时间:2011-11-04 16:29:41

标签: jquery jquery-ui

我有以下代码,我有jQuery UI Slider的问题。我的问题是什么:

滑块渲染正确时,它表现得非常奇怪。我的意思是什么?它不是渲染到处理程序,而是只渲染一个,滑块只能滑动,直到值70,这是我的数组中的第二个值。请问如何解决这个问题?

这是我的代码:

HTML:

<td valign="top">
    <input 
        class="slider_hidden" 
        type="hidden"
        name="field_name" 
        value="10,70" 
        id="slider_hidden" 
        data-disabled="0"
        data-min="0"
        data-max="100"
        data-orientation="horizontal"
        data-step="1"
        data-range="1"
    />
    <div class="slider"></div>
    <br />
    <span class="description"><?php echo $description; ?></span>
</td>

的JavaScript

$(document).ready(
    function()
    {
        $(".slider").each(
            function()
            {
                var val = $(this).prev('input.slider_hidden').val();
                var min = $(this).prev('input.slider_hidden').data('min');
                var max = $(this).prev('input.slider_hidden').data('max');
                var step = $(this).prev('input.slider_hidden').data('step');
                var slide_disabled = ($(this).prev('input.slider_hidden').data('disabled') == "1" ? true : false);
                var orientation = $(this).prev('input.slider_hidden').data('orientation');
                var range = ($(this).prev('input.slider_hidden').data('range') == "1" ? true : false);

                $(this).slider(
                    {
                        min: min,
                    max: max,
                        step: step,
                        disabled: slide_disabled,
                        orientation: orientation,
                        slide: function(e, ui)
                        {
                            console.log(ui);
                            $(this).prev('input.slider_hidden').val(ui.value);
                        }
                    }
                );

                $(this).slider('option', 'range', range);

                if(range == true)
                {
                    var s = val.split(',');
                    $(this).slider("option", "values", s);
                }
                else
                {
                    $(this).slider("option", "value", val);
                }
            }
        );
    }
);

请注意,所有值都可以从隐藏字段中正确检索。

1 个答案:

答案 0 :(得分:2)

经过长时间的调查后,您似乎可以在初始化后设置valuesvalue

所以我找不到其他解决方案而不是这样做:http://jsfiddle.net/7YVVY/1/

它有效,但不优雅:)