Question

我正在使用jQuery UI范围滑块演示代码（http://jqueryui.com/demos/slider/#range）来创建价格范围滑块。我想将从此范围滑块中选择的值传输到minValue＆amp;的获取参数。 maxValue。

我一直试图通过让JavaScript更新下面表单中的隐藏字段来实现这一点，但这似乎不起作用，因为页面重新加载URL查询字符串如下所示：{{1并且没有从范围滑块传输任何值。如何将范围滑块中的值提取到查询字符串？

提前致谢。

?minValue=&maxValue=&submit=go

Answer 1

您正在滑块代码之外设置min / maxValues。将这些行移到slide回调函数中。

slide: function( event, ui ) {
    $( "#amount" ).val( "£" + ui.values[ 0 ] + " - £" + ui.values[ 1 ]);
    $( "#minValue" ).val( ui.values[ 0 ] );
    $( "#maxValue" ).val( ui.values[ 1 ] );
}

Answer 2

当您在document.ready上拨打以下两行时，ui变量不存在：

$( "#minValue" ).val( ui.values[ 0 ] );
$( "#maxValue" ).val( ui.values[ 1 ] );

您是否检查过ui回调函数中的slide变量，以确保正确访问数据？如果您还没有，请尝试此操作，看看开发人员工具控制台中出现了什么：

    slide: function( event, ui ) {
        console.log(ui);
        $( "#amount" ).val( "£" + ui.values[ 0 ] + " - £" + ui.values[ 1 ]);
    }

此外，文档还说明了您访问这些值的方式：

var values = $("#slider-range").slider( "option", "values" );

返回一个数组，所以我假设要访问你要执行此操作的值：

var min = values[0],
    max = values[1];

jquery范围滑块值来查询字符串

2 个答案: