如何从 JQuery - IonRangeSlider 获取值? [英] How to get values from JQuery - IonRangeSlider?

问题描述

如何从 获得低值和高值ion.rangeSlider 组件通过单击按钮?

how can I get low and high values from ion.rangeSlider component by clicking a button?

这是我的 jQuery 代码:

This is my jQuery code:

<script>
    $(document).ready(function(){
        $("#range_1").ionRangeSlider({
            min: 10,
            max: 50,
            from: 10,
            to: 20,
            type: 'double',
            step: 1,
            prettify: true,
            hasGrid: false
        });
    });
</script>

<script>
 $(document).ready(function(){
    $('#get_values').click(function(){
            var low = $('#range_1').... ???;
            var high = $('#range_1').... ???;
            alert(low);
        });
 });
</script>

推荐答案

这里有一个解决方案:http://jsfiddle.net/IonDen/xaaw56bk/

var $range = $(".js-range-slider"),
    $result = $(".js-result"),
    $getvalues = $(".js-get-values"),

    from = 0,
    to = 0;

var saveResult = function (data) {
    from = data.fromNumber;
    to = data.toNumber;
};

var writeResult = function () {
    var result = "from: " + from + ", to: " + to;
    $result.html(result);
};

$range.ionRangeSlider({
    type: "double",
    min: 10,
    max: 50,
    from: from,
    to: to,
    onLoad: function (data) {
        saveResult(data);
        writeResult();
    },
    onChange: saveResult,
    onFinish: saveResult
});

$getvalues.on("click", writeResult);

这篇关于如何从 JQuery - IonRangeSlider 获取值?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！