引導滑塊設置值問題

Question

我使用bootstrap slider並尋找一種方法來設置從輸入類型的句柄值「text」 我設法設置處理程序的輸入值，如何做相反的方式？

$("#ex6").slider(); 
$("#ex6").on("slide", function(slideEvt) { 
    $("#ex6SliderVal1").val(slideEvt.value[0]); 
    $("#ex6SliderVal2").val(slideEvt.value[1]); 
}); 

這裏是我的fiddle

請指教，謝謝

Answer 1

用如下的代碼基於輸入文本來改變句柄值：

var minSliderValue = $("#ex1").data("slider-min"); 
 
var maxSliderValue = $("#ex1").data("slider-max"); 
 

 
$('#ex1').slider({ 
 
    value : 0, 
 
\t formatter: function(value) { 
 
\t \t return 'Current value: ' + value; 
 
\t } 
 
}); 
 

 
$("#inputValue").on("keyup", function() { 
 
    var val = Math.abs(parseInt(this.value, 10) || minSliderValue); 
 
    this.value = val > maxSliderValue ? maxSliderValue : val; 
 
    $('#ex1').slider('setValue', val); 
 
});

.wrapper { 
 
    padding : 20px; 
 
    margin-top : 20px; 
 
}

<link href="http://seiyria.com/bootstrap-slider/css/bootstrap-slider.css" rel="stylesheet"/> 
 
<link href="http://seiyria.com/bootstrap-slider/dependencies/css/bootstrap.min.css" rel="stylesheet"/> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> 
 
<script src="http://seiyria.com/bootstrap-slider/js/bootstrap-slider.js"></script> 
 
<div class="wrapper"> 
 
<input id="ex1" data-slider-id='ex1Slider' type="text" data-slider-min="0" data-slider-max="20" data-slider-step="1" /> 
 
    <hr /> 
 
    <input type="text" class="form-control" id="inputValue" value="0" /> 
 
</div>

這裏我的jsFiddle全面實施改變價值，反之亦然。