【问题标题】:Syntax for getting the value of a specific handle with a jQuery UI Range Slider使用 jQuery UI Range Slider 获取特定句柄值的语法
【发布时间】:2013-03-15 17:05:05
【问题描述】:

使用 jQuery UI Range Slider 获取特定句柄的值的正确语法是什么?演示中给出并在下面函数中使用的方法获取两个句柄的值$("#selector").slider("option", "values");

我都试过了:("option", "values[0]")("option", "ui.values[0]")

下面的函数允许我分别显示每个句柄的值,但我还需要设置它们关联的表单元素的值,并且相同的语法似乎不适用于此。我在这里发布了这个功能的小提琴:http://jsfiddle.net/chayacooper/Xn9sf/

$("#priceRange").slider({
    range: true,
    min: 0,
    max: 1000,
    values: [0, 1000],
    step: 25,
    slide: function (event, ui) {
        $("#min_price").text("$" + ui.values[0]);
        $("#max_price").text("$" + ui.values[1]);
        var minPriceRange = $("#priceRange").slider("option", "values");     
        $("#min_price_range").val(minPriceRange);
        var maxPriceRange = $("#priceRange").slider("option", "values");
        $("#max_price_range").val(maxPriceRange);
    }
});

HTML

<div id="priceRange"></div>
<div id="min_price">$0</div>
<div id="max_price">$1000</div>
<input type=text name="min_price_range" id="min_price_range" />
<input type=text name="max_price_range" id="max_price_range" />

【问题讨论】:

    标签: jquery-ui handle key-value jquery-ui-slider


    【解决方案1】:

    您已经在设置#minprice#maxprice 时使用了这些值,因此请使用相同的值设置inputs 的值:

    $("#priceRange").slider({
        range: true,
        min: 0,
        max: 1000,
        values: [0, 1000],
        step: 25,
        slide: function (event, ui) {
            $("#min_price").text("$" + ui.values[0]);
            $("#max_price").text("$" + ui.values[1]);
    
            $("#min_price_range").val(ui.values[0]);
            $("#max_price_range").val(ui.values[1]);
        }
    });
    

    【讨论】:

    • 谢谢 :-) 我之前尝试过一些非常相似的方法,但没有成功,但我不知何故忽略了这种格式
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-11-16
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多