Question

我尝试将3个jquery ui滑块互连，3个滑块的总和必须始终保持为100，因此当我更改一个滑块的值时，必须更新其他滑块。

例如，如果一个滑块的值为40并且我将此值提高到50，则另外两个滑块必须减少5。

有人能帮帮我吗？感谢

Answer 1

高值的概率在任何情况下都是50 ...所以将所有三个滑块设置为0到50 ......并将它们的类设为class =“selector inactive”

$(".selector").slide(function(event, ui){

    $(event.srcElement).removeClass('inactive');

    var valuechange = 0;

    $('.inactive').each(function(value, item){
       // get sum of other two sliders
       valuechange += $(item).slider( "option", "value");
    });

    // subtract sum(othertwo) + this value with 100 to get current changed value
    valuechange = (valuechange + (ui.values[0])) - 100;

    $('.inactive').each(function(value, item){
          // add other sliders values to changedvalue / 2
          $(item).slider( "option", "value", $(item).slider( "option", "value") + (( valuechange / 2) * -1));
    });

    $(event.srcElement).toggleClass('inactive');
});

希望这能解决你的问题

Jquery多个滑块相互连接

1 个答案: