如何判断输入范围元素在拖动时是增加还是减少

Question

所以我有一些 <input type="range"> 元素需要知道当用户拖动范围滑块时值是增加还是减少。到目前为止，我所能够 find/implement 是当用户第一次触摸或释放滑块并将当前变化值与最后一个数字进行比较时使用的东西，但这不起作用，因为它无法补偿当用户仍在拖动时。

有没有办法仅使用 JS 数学来实现此目的？

Answer 1

我从 this post 中发现，在捕获 onInput 或 onChange 事件方面，这并不是看起来的样子。要捕获滑块的每个移动，请使用 onInput。以下是说明的差异。

您可以按照您的想法执行相同的逻辑，即保存最后一个值，然后检查当前值是小于还是大于最后一个值，以查看它是增加还是减少。

编辑： 请注意，如果您使用箭头键移动滑块，两个事件会同时触发。如果您使用鼠标，只有当您停止移动并松开鼠标按钮时，两者才会被触发。

var lastNum = 0;
function onInput(value) {
  if(lastNum < value) {
      console.log("increasing");
  } else {
      console.log("decreasing");
  }
  lastNum = value;
  console.log("onInput: " + value);
}

function onChange(value) {
  console.log("onChange: " + value);
}

<input type="range" oninput="onInput(this.value)" onchange="onChange(this.value)">

如何判断输入范围元素在拖动时是增加还是减少

how to tell if an input range element is increasing or decreasing while dragging

javascript

slider

react-native-android

uislider