Question

我有一个价格范围滑块添加到php搜索表单，它使用Prototype。这是表单代码：

<input type="text" name="pmin" id="pmin" value="0" onkeypress="return isNumberKey(event)"
/>
<input type="text" name="pmax" id="pmax" value="500" onkeypress="return isNumberKey(event)"
/>
<div id="price-range" class="filter-track"> <span id="pminx" class="filter-handle" title="Scroll to set minimum value"></span>

    <span
    id="pmaxx" class="filter-handle" title="Scroll to set maximum value"></span>
</div>

以下是处理滑块的 javascript 代码：

<script>
    var loadPriceSlider = function () {
        var handles = [$('pminx'), $('pmaxx')];
        // horizontal slider control with preset values
        priceRange = new Control.Slider(handles, 'price-range', {
            range: $R(0, 500, false),
            sliderValue: [0, 500],
            values: [0, 10, 20, 30, 40, 50, 60, 70, 80, 90, 100, 110, 120, 130, 140, 150, 160, 170, 180, 190, 200, 210, 220, 230, 240, 250, 260, 270, 280, 290, 300, 310, 320, 330, 340, 350, 360, 370, 380, 390, 400, 410, 420, 430, 440, 450, 460, 470, 480, 490, 500],
            restricted: true,
            onSlide: function (v) {
                $('pmin').value = ((v[0] != null) ? v[0] : 0);
                $('pmax').value = ((v[1] != null) ? v[1] : 0);
            },
            onChange: function (v) {
                if (v.length > 0) {
                    $('pmin').value = ((v[0] != null) ? v[0] : 0);
                    $('pmax').value = ((v[1] != null) ? v[1] : 0);
                }
            }
        });
    };
    loadPriceSlider();
</script>

我需要在搜索结果页面中显示用户所做的选择。目前表单有效，如果用户在此价格滑块上进行了一些选择，则会显示正确的结果，但输入会将最小值和最大值显示为0和500，默认值为。

Answer 1

要在jquery中指定值，您应该使用

$('#pmin').val((v[0] != null) ? v[0] : 0));
$('#pmax').val((v[1] != null) ? v[1] : 0));

Answer 2

我不知道你正在使用什么插件。但是如果它有default选项或initial value选项，你可以传递来自php的默认值...类似

priceRange = new Control.Slider(handles, 'price-range', {
        range: $R(0, 500, false),
   ---> default: [<?php echo $min; ?>, <?php echo $max; ?>], // or initial or something
        sliderValue: [0, 500],

并从php控制$ min和$ max。因此，在提交搜索之后，您将把以前的值传递给JS插件。

希望这有帮助

显示用户选择

2 个答案: