如何为引导滑块添加onclick功能？
如何为引导滑块添加onclick功能？
提问于 2018-07-16 05:48:57
我有鞋带滑块。它工作得很好，目前，当我通过拖动操作更改值时，我的滑块事件可以工作。但是当我单击滑块条时，如何添加事件呢？
myHtml：
<div class="slider warning " style="padding-right: 20px;">
<label style="font-family: 'Open Sans';padding-top: 10px;">Variants</label><div style="text-align: center" id='res1'>0</div><br>
<input type="text" id="variantslider" class="slider-element form-control" value="" data-slider-value="20" data-slider-step="1" data-slider-max="20" data-slider-min="1" data-slider-orientation="vertical" data-slider-selection="before" data-slider-tooltip="hide" >
</div>我的：
$('#variantslider').slider().on('slideStart', function(ev){
originalVal = $('#variantslider').data('slider').getValue();
});
//Catch slider stop event and capture value
$('#variantslider').slider().on('slideStop', function(ev){
$('#variantslider').slider().on('slideStop', function(ev){
var newVal = $('#variantslider').data('slider').getValue();
//detect if slider value has been changed
if(originalVal != newVal) {
//my ops
}
});
});回答 2
Stack Overflow用户
回答已采纳
发布于 2018-07-16 06:54:46
对于一般的Jquery操作也是如此。
$("#variantslider").on("click", function(){
alert(" I'm clicked! ");
});我试过了，效果很好。以下是我的例子：
Stack Overflow用户
发布于 2019-07-03 18:37:00
如果还没有，应该检查下面链接上的滑块的文档。
https://github.com/seiyria/bootstrap-slider
您可以看到需要检查值是否更改的所有事件。
对于单击滑块上的事件，可以使用"change“或"slideStop”事件。
当使用"change“事件时，"event.value”返回一个具有两个属性的对象："oldValue“和"newValue"；
以下是你的例子：
$("#variantslider").slider();
$("#variantslider").on("slideStop", function(event){
console.log('slider value: ', event.value);
});
$("#variantslider").on("change", function(event){
console.log('slider value: ', event.value.oldValue, event.value.newValue);
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51355278
复制相关文章
相似问题
腾讯云开发者
