在 rangeslider.js 中禁用某些范围

Posted 2023-02-18

【中文标题】在 rangeslider.js 中禁用某些范围

【英文标题】：Disable certain range in rangeslider.js

【发布时间】：2020-03-14 23:11:06

【问题描述】：

我正在使用 rangeslider.js，我正在尝试禁用滑块以滑到 20 以下

<input type="range" class="range-slider" value="30" min="0" max="100" from="0" step="1">

我正在使用start 属性来完成这项工作，但它不是那样工作的。

这是小提琴https://jsfiddle.net/moviecrew/awejnkof/16/

【问题讨论】：

如果将 min 属性设置为 20 会怎样？

@VishnuBhadoriya 如果这样做，它也不会显示起始范围。我需要范围可见但禁用，因此您不能在其下方滑动。

查看我下面的答案

【参考方案1】：

如果您将 min 属性设置为 20，那么它将创建从 20 开始的范围滑块值 或者如果您需要值必须从 0 到 100 并防止低于 20，那么您可以尝试以下解决方案

$('input[type="range"]').rangeslider(
  polyfill: false,
  onSlide: function(position, value) 
    if(value < 20)
    $('input[type="range"]').val(20);
    $('input[type="range"]').rangeslider('update', true);
    
  
);

【讨论】：

这正是我想要的。你可以在这里看到这个实现jsfiddle.net/moviecrew/awejnkof/22你觉得这里实现的方式好不好？还是我在这里做错了什么？

有些不对劲，第一次，滑块超出了tppr.me/NQwoS 的范围，当我滑回起始位置并再次移动时，它工作正常。 tppr.me/7J0La jsfiddle.net/moviecrew/awejnkof/41 最新的小提琴在这里