Запретить переход по ссылке, если было движение мышкой

Question

Как зафиксировать движение мышкой при нажатой, но еще не отжатой левой кнопке, (а еще лучше движение мышкой вправо\влево)? Чтобы применить как-то так:

$(".myblock a").on('click', function(){
  if ( /* тут понять было ли движение мышкой*/ ){
    return false;
  }
});

Answer 1

Когда вы кликаете по кнопке, происходит 3 инвента: mousedown, mouseup и уже потом click (перечислены в порядке срабатывания)

см. пример:

const button = document.querySelector('button')

button.onclick = () => {
  console.log('click')
}

button.onmousedown = () => {
  console.log('mousedown')
}


button.onmouseup = () => {
  console.log('mouseup')
}

<button>click me</button>

Вам нужно отлавливать ивент mousemove непосредственно после срабатывания mousedown

const button = document.querySelector('button')

button.onmousedown = () => {
  //при нажатии добавляем обработчики
  button.onclick = clickHandler; //можно отслеживать как click, так и mouseup
  button.onmousemove = mouseMoveHandler;
}



const clickHandler = () => {
  console.log('Клик!')
  removeEvents()
}

const mouseMoveHandler = () => {
  console.log('Шевелишь!')
  //удаляем обработчики
  removeEvents()
}

const removeEvents = () => {
  button.onclick = null
  button.onmousemove = null
}

<button>click me</button>

БЛОГ НА HUSL

Запретить переход по ссылке, если было движение мышкой

Ответы (1 шт):