jquery ui slider隐藏输入不会更新事件

时间:2013-11-20 18:35:06

标签: jquery jquery-ui slider

我尝试更新jquery ui滑块内隐藏的输入字段但不会发生。我一直在使用以下代码。使用Firebug输入字段检查DOM不会在事件上更新。显示初始值。

 // --- Price Slider
        $("#price_slider").each(function() {
            $(this).slider({
                animate: true,
                step: 25,
                range: true, min: <?= $sel_minmax['price_min'] ?>, max: <?= $sel_minmax['price_max'] ?>,
                values: [<?= $params['price_min'] . ',' . $params['price_max'] ?>],
                change: function() {

                    // get slider values
                    var lower = $(this).slider("values", 0);
                    var upper = $(this).slider("values", 1);

                    // update spans with slider values
                    $(this).children("a.ui-slider-handle").first().children("span").html(lower + '€');
                    $(this).children("a.ui-slider-handle").last().children("span").html(upper + '€');
                }

            });
            $("input[id=price]").val($("#price_slider").slider("values", 0) + ";" + $("#price_slider").slider("values", 1));
            $(this).children("a.ui-slider-handle").html("<span class='Slider_Value'></span>");
        });

HTML

<p>
        <span class="min"></span>
        <span class="max"></span>
        <input type="hidden" id="price" />
</p>

<div id="price_slider"></div><br>

的jsfiddle http://jsfiddle.net/lgtsfiddler/aTLGA/2/

1 个答案:

答案 0 :(得分:0)

只有隐藏的输入字段不会更新?我认为如果你为这样的事情改变你的代码它将起作用:

$(function() {
  // --------------------------------
        // --- Price Slider
        $("#price_slider").each(function() {
            $(this).slider({
                animate: true,
            step: 25,
            range: true, min: 1200, max: 5000,
            values: [1200 , 5000],
            change: function() {

                // get slider values
                var lower = $(this).slider("values", 0);
                var upper = $(this).slider("values", 1);

                // update spans with slider values
                $(this).children("a.ui-slider-handle").first().children("span").html(lower + '€');
                $(this).children("a.ui-slider-handle").last().children("span").html(upper + '€');
                $("input[id=price]").val(lower+";"+upper);
            }

        });

        $(this).children("a.ui-slider-handle").html("<span class='Slider_Value'></span>");
    });


});

那是你的问题吗?