根据更改第一个引导滑块的值动态设置第二个引导滑块的值

Question

我在我的项目中实现了两个引导滑块。并且我想要根据第一个滑块动态滑动来更改第二个滑块的值。但它不起作用。

我该如何做到这一点？

我的HTML代码： -

<td><input id="ex1" type="text" value="" class="slider form-control" data-slider-min="0" data-slider-max="1500" data-slider-step="5" data-slider-value="1000" data-slider-orientation="vertical" data-slider-selection="after" data-slider-tooltip="show" data-slider-id="red"></td> 

<td><input id="ex2" type="text" value="" class="slider form-control" data-slider-min="0" data-slider-max="2000" data-slider-step="5" data-slider-value="1200" data-slider-orientation="vertical" data-slider-selection="after" data-slider-tooltip="show" data-slider-id="blue"></td> 

我的jQuery代码如下：但没有下面的方法的工作

$("#ex1").on("slide", function() { 
    $("#ex2").attr('data-slider-value', '200'); 
}); 


$("#ex1").on("slide", function() { 
    $("#ex2").val('200'); 
}); 


$("#ex1").on("slide", function() { 
    $("#ex2").attr('value', '200'); 
}); 

Answer 1

现在我已经固定我的问题是这样的：

$("#ex1").on("slide", function() { 
var minSliderValue = $("#ex2").data("slider-min"); 
var maxSliderValue = $("#ex2").data("slider-max"); 

$('#ex2').slider({ 
value : 0, 
reversed:true, 
formatter: function(value) { 
return 'Current value: ' + value; 
} 
}); 

$("#aqua").hide();//hide duplicate slider based on id 

var val = Math.abs(parseFloat(ownesAmt, 10) || minSliderValue); 
this.value = val > maxSliderValue ? maxSliderValue : val; 
$('#ex2').slider('setValue', val); 

}）;