从jQuery Mobile Slider获取值并将其设置在另一个滑块上

时间:2013-01-23 05:56:50

标签: jquery jquery-mobile

我试图在拖动它之后从jQuery移动滑块中取一个值,然后以编程方式将其设置为另一个jQuery移动滑块。

我已尝试$(selector).slider(value)$(selector).attr('value)$(selector).slider().value(),但这些似乎都不适用于我的情况。

我正在使用jQuery Mobile 1.2.0和jQuery 1.8.0

以下是我正在努力工作的代码:

$('#slider1').change(function(){
        var slide1Val = $(this).val();
        $('#slider2').val(slide1Val).slider('refresh');
};

Here's the actual URL that I'm trying to work on

2 个答案:

答案 0 :(得分:1)

你可以做这样的事情

$("#gen1").live("pageinit",function(){
     $("#slider1").change(function(){
         $("field1").html(this.value);
         $("#slider2").val(this.value/2);
         $("#slider2").slider("refresh");
   });
});

希望这有帮助

答案 1 :(得分:1)

以下是一个有效的例子:http://jsfiddle.net/Gajotres/PzTeX/

为此问题创建了该示例:https://stackoverflow.com/a/13554192/1848600

我是一个月前做的。基本上它根据第一个移动3个其他滑块,这是一个代码示例:

$("input#europe, input#us, input#uk, input#japan").live("slidestop", function() {
    $(this).mouseup();
    var changeVal = ($(this).val() - $(this).attr('min'))/($(this).attr('max') - $(this).attr('min'));
    changeSliders(changeVal, $(this).attr('id'));    
});

function changeSliders(changeVal, sliderID){
    $("input#europe, input#us, input#uk, input#japan").each(function(){
    var newValue = parseFloat($(this).attr('min')) + parseFloat(($(this).attr('max') - $(this).attr('min')))*changeVal;
    if($(this).attr('id') != sliderID) {    
        $(this).val(newValue);
    }
    });
    $("input#europe, input#us, input#uk, input#japan").slider('refresh');    
}