如何重置 NoUiSlider？答案

【问题标题】：How to reset NoUiSlider?如何重置 NoUiSlider？
【发布时间】：2015-07-07 13:27:10
【问题描述】：

如何使用 javascript 以特定形式重置所有滑块？（jquery 也可以）http://refreshless.com/nouislider/

【问题讨论】：

【解决方案1】：

// Set one .noUiSlider.setue
slider.noUiSlider.set(10);
slider.noUiSlider.set([150]);

// Set the upper handle,
// don't change the lower one.
slider.noUiSlider.set([null, 14]);

// Set both slider handles
slider.noUiSlider.set([13.2, 15.7]);

【讨论】：

我知道这样，这不是我要找的。我想一次重置许多滑块。有可能吗？
这将设置而不是重置新值。区别很重要，因为有时您不希望触发“设置”和“更新”事件。例如，当您有许多滑块并且想要重置除用户正在玩的那个之外的所有滑块时。
@RegularEverydayNormalGuy 创建一个新问题并...是问题还是建议？
这是一个声明，解释了为什么您的解决方案没有回答“如何重置 NoUiSlider？”问题。
对不起，我希望我可以：stackoverflow.com/questions/38781910/…

【解决方案2】：

有点晚了，但Praveen's comment 的链接为我指明了正确的方向。

在noUiSlider-Reference 中提到了重置方法，它将滑块重置为其起始值，这正是我所寻找的：

    // Return to the 'start' values
    // Does NOT reset any other slider properties
    slider.noUiSlider.reset()

【讨论】：

【解决方案3】：

在使用 NoUISlider v7.0 时遇到了同样的问题（我知道有一个较新的），这就是我解决它的方法：

鉴于以下标记：

<div class="container">
    <label>Price</label>
    <div class="slider" data-min="100" data-max="900000" data-step="1000"></div>
    <input type="hidden" class="input-filter-min" value="100" />
    <input type="hidden" class="input-filter-max" value="900000" />
    <span class="filter-min"></span> - <span class="filter-max"></span> €
</div>

以及以下初始化：

$('.slider').each(function() {
     $(this).noUiSlider({
            connect: true,
            behaviour: 'tap',
            start: [100,900000],
            step: 1000,
            range: {
                'min': 100,
                'max': 900000
            }
        });
});

销毁并重新初始化（单击某处或您的操作后）：

$('.slider').each(function() {
        $(this)[0].destroy();
        $(this).parent().find('span[class^="filter"]').text('');

        var min = parseInt($(this).attr('data-min')), max = parseInt($(this).attr('data-max'));

        $(this).parent().find('.input-filter-min').val(min);
        $(this).parent().find('.input-filter-max').val(max);
    });    

    setNoUiSliders(); // which is a function that do the basic initialization in the previous example

【讨论】：

【解决方案4】：

<sliderName>.noUiSlider.reset();

如果您有多个滑块，请按照以下方式实现循环：

var sliderName = ["A","B","C"];
for(var i=0; i<sliderName.length; i++){
  sliderName[i].noUiSlider.reset();
}

【讨论】：