Question

我正在尝试在网站上添加几个滑块，但我被卡住了。我直接从他们的网站下载了nouislider脚本，在此之前，我将jQuery 1.8.0添加到了我的网站。这就是我制作的：

的index.html

<head>
   ...
   <link rel="stylesheet" href="Content/noUiSlider/jquery.nouislider.css" type="text/css">
   <script src="Scripts/jquery-1.8.0.min.js"></script>
   <script src="Scripts/jquery.nouislider.js"></script>
   <script src="Scripts/website.js"></script>
   ...
</head>
<body>
   ...
   <div id="sslider" class="noUi-target noUi-ltr noUi-horizontal noUi-background"></div>
   ...
</body>

website.js

(function () {
   $("#sslider").noUiSlider({
       start: 5,
       range: {
           'min': 1,
           'max': 80
       }
   });
})();

当我在Chrome中调试时，我确实抓住了这个： Exception

你能帮助我吗？

Answer 1

我将您的示例复制到测试文件中，并且工作正常。我也无法看到当前版本的noUiSlider如何生成示例中的错误消息，因此我建议使用最新版本的noUiSlider和最新版本的jQuery。

在页面加载后like this仅运行此JS也是一个好主意：

$(function() {
    $("#sslider").noUiSlider({
        start: 5,
        range: {
            'min': 1,
            'max': 80
        }
    });
});

Answer 2

好的，问题解决了。我从NuGet（来自VisualStudio 2013）下载了jquery.nouislider.js，他们为我提供了较旧或损坏的文件。我以为该文件来自网站，但我浏览了NuGet并注意到，我已经从那里下载了。

代码没有问题但有文件。课程：在提问之前，将官方文件与您已安装的文件进行比较。

Answer 3

尝试按照 official docs ：

进行操作

$("#slider").noUiSlider({
    start: [5],
    connect: true,
    range: {
        'min': 1,
        'max': 80
    }
});

未捕获的RangeError：noUiSlider

3 个答案: