seiyria/bootstrap-slider getValue() 不工作 [英] seiyria/bootstrap-slider getValue() not working

问题描述

我已经查看了有关此主题的所有答案，但由于某种原因，我无法让它发挥作用.我设置了一个带有以下标记的滑块:

I've looked through all the answers on this topic, but for some reason I can't get it to work. I've set up a slider with the following markup:

<input data-slider-id="Xslide" type="text" data-provide="slider" data-slider-min="0" data-slider-max="10" data-slider-step=".5" data-slider-value="0" data-slider-tooltip="show" data-slider-orientation="vertical" data-slider-reversed="true"></input>

我首先想要的是console.log它的数值.我试过用 type 到 number 或 text ，但这没有用.我按照 GitHub 上的示例进行了尝试:

What I want first of all is to console.log its numerical value. I've tried playing with the type to number or text but that didn't work. I tried as per the example on GitHub:

var mySlider = $("Xslide").slider();
var value = mySlider.slider('getValue');
console.log(value);

但是产生了错误 $(...).getValue is not a function

我尝试编写 $('#Xslide').data('slider').getValue() 但这产生了错误 $(...).data(...) 未定义.

I tried writing $('#Xslide').data('slider').getValue() but that produced the error $(...).data(...) is undefined.

我尝试了示例页面上提供的解决方案，例如

I tried solutions offered on the example page like

$('#Xslide').slider({
    formatter: function(value) {
        console.log('Current value: ' + value);
    }
});

但这根本没有在控制台中显示任何内容..

but that just doesn't show anything in the console at all..

我已经包含了以下 js 和 css 文件:

I've included the following js and css files:

<script src="js/bootstrap-slider.min.js"></script>
<link href="stylesheets/bootstrap-slider.min.css" rel="stylesheet">

不知道为什么它不起作用...也许是关于输入元素 id 或 type，但任何帮助将不胜感激.

Not sure why it isn't working... perhaps it's something about the input element id or the type, but any help would be appreciated.

推荐答案

无论如何，到目前为止我已经解决了它:

In any case so far I've solved it using:

var Xslide = new Slider('#Xslide'); 

Xslide.on('slideStop', function (value) { document.getElementById('xval').innerHTML = value; 
})

谢谢！

这篇关于seiyria/bootstrap-slider getValue() 不工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！