как определить, увеличивается или уменьшается элемент входного диапазона при перетаскивании - PullRequest
Новая
       13

как определить, увеличивается или уменьшается элемент входного диапазона при перетаскивании

0 голосов
/ 30 апреля 2018

Итак, у меня есть несколько <input type="range"> элементов, которые мне нужно знать, если значение увеличивается или уменьшается, когда пользователь перетаскивает ползунок диапазона. Пока все, что я смог найти / реализовать, это вещи, которые используют, когда пользователь впервые касается или отпускает ползунок и сравнивает текущее изменяющееся значение с этим последним числом, но это не сработает, потому что он не может компенсировать, когда пользователь все еще тянет.

Есть ли способ достичь этого, используя только математику JS?

1 Ответ

0 голосов
/ 30 апреля 2018

Я узнал из этого сообщения, что это не то, что кажется в отношении захвата событий 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)">
...