在按住 ctrl 键的情况下阻止输入范围元素上的事件-解网

问：

当最初按住 ctrl 键在输入范围元素上移动鼠标时，输入或更改事件的移动和处理在 Firefox （windows 10）中被阻止，在 Chrome 中一切正常。

也许使用 javascript 有一些方法可以解决这个问题？

我希望在按下 ctrl 键并且鼠标左右移动时更改范围步长，就像滚轮事件一样：

  const input = document.querySelector("input");
  const currentStep = document.querySelector(".current-step");
  currentStep.textContent = input.min;

  input.addEventListener("input", (event) => {
    const target = event.target;

    currentStep.textContent = target.value;
  });

  input.addEventListener("wheel", (event) => {
    event.stopPropagation();

    const target = event.target;

    if (event.ctrlKey) {
      target.step = 0.01;
    } else {
      target.step = 0.25;
    }
  });

<input type="range" min="0.25" max="5.5" step="0.25" value="0" />
<div class="current-step">0</div>

JavaScript Firefox 事件

在按住 ctrl 键的情况下阻止输入范围元素上的事件

Blocking an event on the input range element with ctrl-key pressed

评论