twitter-bootstrap Bootstrap 滑块设置值问题
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/33658932/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Bootstrap slider set value issue
提问by Ievgen Chernetsov
I use bootstrap sliderand looking for a way to set a value of the handle from the input type="text" I managed to set value for input from the handler, how do do it in opposite way?
我使用bootstrap 滑块并寻找一种方法来从 input type="text" 设置句柄的值我设法为来自处理程序的输入设置了值,如何以相反的方式做到这一点?
$("#ex6").slider();
$("#ex6").on("slide", function(slideEvt) {
$("#ex6SliderVal1").val(slideEvt.value[0]);
$("#ex6SliderVal2").val(slideEvt.value[1]);
});
Here is my fiddle
这是我的小提琴
Please advise, thanks
请指教,谢谢
回答by khairul.ikhwan
Use below's code to change handler value based on input text :
使用以下代码根据输入文本更改处理程序值:
var minSliderValue = $("#ex1").data("slider-min");
var maxSliderValue = $("#ex1").data("slider-max");
$('#ex1').slider({
value : 0,
formatter: function(value) {
return 'Current value: ' + value;
}
});
$("#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>
Here is my jsFiddlefor full implementation on changing value vice versa.
这是我的jsFiddle,用于完全实现改变价值,反之亦然。

