2013-01-23 62 views
2

我试图从一个jQuery移动滑块拖动值了一点,然后以编程方式设置到另一个jQuery的移动滑块后。以从jQuery Mobile的滑块的值,并设置它在另一个滑块

我试过$(selector).slider(value)$(selector).attr('value)$(selector).slider().value()但他们都似乎没有在我的情况下工作。

我使用jQuery移动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

回答

1

可以做这样的事情

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

希望这会有所帮助

+0

您可以在这里找到一个小提琴jsfiddle.net/YemGJ/1。但是,你的代码是正确的,并且工作正常。请让我知道如果我失去了一些东西。 – saraf

+0

这个很有意义。玩弄了那个小提琴,但它似乎并没有很好地融入我的代码中。下面是我的代码http://jsfiddle.net/b3bJr/5/小提琴 – alvinjorrel

+0

你可以找到你的代码在这里工作小提琴http://jsfiddle.net/b3bJr/7/我加入的变化事件“ “gen1”的pageinit'。这将确保在你执行任何事情之前,div是好的。希望这有助于 – saraf

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');  
}