jquery 滑块根据使用的控制外围设备更改步长值答案

【问题标题】：jquery slider alter step value based on control peripheral usedjquery 滑块根据使用的控制外围设备更改步长值
【发布时间】：2017-06-01 16:15:00
【问题描述】：

编写代码，以便您可以看到我在使用什么。

$("#slider-markup").slider({
    orientation: "horizontal",
    range: "min",
    min: 0,
    max: 500,
    value: 0,
    step: 0.01,
    slide: function (event, ui) {
        $("#markupRate").text(ui.value);
        calcNow();
    }
});

好的，所以我知道如何逐步递增，正如您在此处看到的那样，这是我正在使用的一个非常精细的步骤，但由于范围大，很难达到正确的值。

我也知道滑块可以用鼠标使用，一旦激活就可以用键盘箭头移动到下一步。

我希望能够将 mouse 步长设置为 1。然后将键盘步长设置为 0.01

这可能吗，已经完成了吗？我一直在寻找这种滑块的功能，但没有找到。

【问题讨论】：

标签： javascript jquery jquery-ui-slider jquery-slide-effects

【解决方案1】：

快速回答：

$(function() {
  $("#slider-markup").slider({
    orientation: "horizontal",
    range: "min",
    min: 0,
    max: 500,
    value: 0,
    step: 0.01,
    slide: function(event, ui) {
      $("#markupRate").text(ui.value);
    }
  });
  $("#slider-markup .ui-slider-handle").mousedown(function() {
    $("#slider-markup").slider("option", "step", 1.0);
  }).mouseup(function() {
    $("#slider-markup").slider("option", "step", 0.1);
  });
});

工作示例：https://jsfiddle.net/Twisty/xkwq87j6/

您可以通过对特定事件进行回调来调整step 选项。

【讨论】：