Question

我正在使用名为asRange的jQuery范围滑块插件

它工作正常，但是当我使用条件语句更新 step 属性时，它正在更新DOM中的值，但是效果并不理想。当范围值小于1时，我需要将步长值设为“ 0.001”，而当范围值大于1时，我需要将步长值设为“ 1”。

如果使用开发人员工具检查DOM元素，您将看到step值正在正确更新，但不能正常工作。

我已经尝试了几个小时。找不到任何东西。任何帮助将不胜感激。

            <input class="range-slider" type="range" min="0.007" max="10" name="price" step="0.001" />
            <script>
              $(document).ready(function() {
                $(".range-slider").asRange();

                $(".range-slider").on('asRange::change', function (e) {
                var val = $(".range-slider").asRange('get');

                  if (val > 1) 
              {
                  $(".range-slider").attr("step" , "1");
              }
              else if (val <= 1) 
              {
                  $(".range-slider").attr("step" , "0.001");
              }


              });
              });
            </script>

Answer 1

改为使用库的更新方法：

$(document).ready(function() {
  $(".range-slider").asRange();

  $(".range-slider").on('asRange::change', function(e) {
    var val = $(".range-slider").asRange('get');

    if (val > 1) {
      $(".range-slider").asRange('update', { step: 1 }); // Here
    } else if (val <= 1) {
      $(".range-slider").asRange('update', { step: 0.001 }); // And Here
    }
  });
});

DOM元素不再更新对象asRange，因此，当您更改DOM元素时，asRange创建的对象将不会得到反映。

jQuery UI Slider更新步骤属性，但不起作用

1 个答案: