问题标签 [nouislider]

到目前为止，我的大部分开发工作都在使用 jQuery，并且在使用 vanilla Javascript 更新 NoUiSlider 时遇到了障碍。

基本上我用以下代码创建了多个滑块：

这一切都很好，花花公子，我意识到我应该通过使用来听它改变的事件update，但我对设置相应值的DRYinput方法非常不熟悉......假设我有以下HTML：

input在修改滑块之后，我将如何添加一个事件侦听器来更新下一个？

我假设我会按照以下方式做一些事情：

但我不知道如何在不使用一堆 ID 之类的情况下使用重复侦听器。任何帮助表示赞赏。

在这里玩：http: //jsfiddle.net/z83oz9np/9/

更新/解决方案

我编写了一个在创建滑块期间调用的绑定函数，如下所示：

我正在使用 3 个 noUISlider。我想结合 3 个滑块的输出来创建一个 html 输出。具体来说，我想使用该组合来选择一个图像文件（即 img135.jpg），其中 1 是第一个滑块的输出，3 是第二个滑块的输出，5 是第三个滑块的输出。我有 27 张图片 - 我希望能够根据 3 个滑块（111.jpg、211.jpg、311.jpg 等到 555.jpg）的组合输出来选择一张。

我有三个提供输出的滑块：

滑块全部输入并输出值。我需要关于如何采取下一步行动的建议。我是 jscript 的新手，因此您可以提供的任何帮助或建议将不胜感激。

肯

是否可以指定 noUiSlider 绘制的工具提示的位置？似乎默认情况下它将第一个放在滑块上，第二个放在下面。我理解这里的可用性目标，但我想把两者都放在上面或下面。

示例（带有上方和下方的工具提示）：http: //jsfiddle.net/leongersen/z83oz9np/2/

我正在使用 NoUiSlider 7（jQuery 版本），如果用户键入的值低于最小值，我想要一个回调函数。

所以我尝试对值进行切片（因为我使用 2 个字符后缀），如果值低于则警告：

但这不起作用。更改仅在滑块更改而不是输入字段更改时才有效

我this noUiSlider在我的应用程序中使用。但我不能使用它的set方法并以编程方式设置它的值。我正在尝试如下：

但它会引发控制台错误，说$(this).noUiSlider.set([null, 2000000]); 不确定什么是正确的方法。根据他们的文档，它应该可以工作..这是演示

HTML

和JS

任何帮助表示赞赏！

我正在尝试将 NoUiSlider（来自 Refreshless.com）包装在 Angular2 组件中（我不确定这本身是否是一个好主意；也愿意就此获得建议）。到目前为止，我已经能够创建一个滑块实例并通过一个函数管理它的事件。该函数虽然在我的组件外部，但无法将此类事件导出为我尝试创建的组件的输出属性。有什么建议吗？提前致谢。这是代码

经过更多挖掘（在 Typescript 中），我似乎找到了解决方案，即使用箭头函数表达式。这里是新代码

我想要一个视频持续时间的滑块，范围从 00:00:10 到 01:30:00。我以毫秒为单位获得持续时间，我也需要以毫秒为单位发送它们。我noUiSlider.create用我的 2 个格式化函数和一个update事件处理程序调用：

问题是该msToHHMMSS函数被调用 3 次，使用 的值10000，5400000然后再次使用10000，然后 HHMMSSToms被调用但使用 的值undefined并抛出错误：Cannot read property 'split' of undefined。

我看过这个问题，但正如我一开始所说的，我需要hh:mm:ss格式。

我有下面form哪个是的method=get。

我有这个JS来发布form价值AJAX

这是我的model

这是我controller处理搜索请求的方法。

UI 渲染使用插件针对最小值和最大值进行noUiSlider，因此输入是readonly通过. 但是，无论何时在服务器中收到模型，它都会作为默认值分配给模型变量，即使在更新之后也是如此。检查时值不会更新，但会反映在. 是的，这是因为 的属性，但是在这些类型的情况下，还有其他方法可以发布只读属性值吗？下面是几张截图，展示了收到时的外观和价值。updatenoUiSliderDOMUIreadonlytextboxUIDOMmodel

用户界面

DOM

模型

更新

URL我可以在as...searchModel.MinPrice=₹2%2C189%2C090.00&searchModel.MaxPrice=₹5%2C772%2C480.00但不是在模型中看到发布的值。不知道怎么上这个..

我正在尝试创建一个基于 noUiSilder 的 MaterialiseCSS 范围滑块。文档说：

为具有广泛范围的值添加范围滑块。这个设置为 0 到 100 之间的数字。我们有两种不同类型的滑块。nouiSlider 是我们修改的第 3 方插件。要使用 noUiSlider，您必须手动链接位于 extras 文件夹中的 nouislider.css 和 nouislider.js 文件。

不幸的是，我做了所有事情，它显示了默认的 HTML 范围（如链接中的那个）。

我的html：

js/phonefinder.js：

我究竟做错了什么？

我正在尝试制作一个 0-2000 的滑块，其中 2000 显示为“2000+”，封装所有 >=2000。

我的编码器如下所示：

但是，这false在 时返回a=2000。我认为这是因为a需要是整数，而不是字符串。那么如何有条件地添加后缀呢？