Question

我使用jQuery从范围滑块获取最小值和最大值，但它没有显示任何内容：

$j("#prise-range-input").ionRangeSlider({
        type: "double",
        grid: true,
        min: 500000,
        max: 15000000,
        from: 500000,
        to: 15000000,
        prefix: "$",
        stop: function( event, ui ) {
            alert(ui.values[0]);
            alert(ui.values[1]);
            $j( "#stopvalue" ).val( "$" + ui.values[0] + " - $" + ui.values[1] );
        }
    });

它没有提醒值，任何人都可以告诉我这有什么不对吗？

Answer 1

如果您查看documentation for the IonRangeSlider插件，则会在设置对象中看到没有stop参数。更改范围时要使用的参数是onFinish。这接受一个函数，它接受一个参数，该参数是一个包含滑块当前状态信息的对象。

考虑到这一点，您的代码应该是这样的：

$j("#prise-range-input").ionRangeSlider({
    type: "double",
    grid: true,
    min: 500000,
    max: 15000000,
    from: 500000,
    to: 15000000,
    prefix: "$",
    onFinish: function(data) {
        console.log(data);
        $j("#stopvalue").val("$" + data.from + " - $" + data.to);
    }
});

Example fiddle

Answer 2

如果你可以继续使用svg，那么d3是滑块的最佳选择。您可以参考下面的链接，了解最大最大滑块。D3 Min-Max Slider

如何从价格范围滑块获得最小和最大范围？

2 个答案: