Отключить прокрутку страницы после нажатия колесиком мыши)

Question

У меня есть таблица в ней много строчек, при клике на поле tr колесиком мыши я получаю значения атрибута data-id и по нему отправляю пользователя на некую ссылку в новой вкладке браузера, вроде все ок


let btnKeys = document.querySelectorAll('table.table.person_table tbody tr');
for (var i = 0; i < btnKeys.length; i++)
{
  btnKeys[i].addEventListener('mouseup', function(event)
  {
    if(event.which == 2)
    {
        window.open('/person/' + this.getAttribute('data-id'), '_blank');
    }
  });
}

Но хочу отметить что когда мы кликнули колесиком мыши курсор становиться будто активным и страница скролиться туда сюда за мышкой.

Как от этого избавиться?) preventDefault не помогает)

Answer 1

Если повесить обработчик события с помощью onmousedown и return false, то это сработает. А почему - я не знаю) Если опытные коллеги подскажут - буду благодарен.

document.querySelector('.block1').addEventListener('mousedown', function(event){
  if (event.which == 2)
    return false;
});

document.querySelector('.block2').onmousedown = function(event){
  if (event.which == 2)
    return false;
};

.test {
  display: flex;
  width: 100%;
}
.block {
  flex: 0 0 50%;
  height: 500px;
}
.block1 {
  background-color: orange;
}
.block2 {
  background-color: green;
}

<div class="test">
  <div class="block block1">Scroll on</div>
  <div class="block block2">Scroll off</div>
</div>

Answer 2

Нормально preventDefault() помогает

document.querySelector('table').addEventListener('mousedown',(event) => {
  if (event.buttons === 4) {
    event.preventDefault();
    let id = event.target.closest('tr').dataset.id;
    console.log(id);
    
    // window.open('url'+id,'_self')
    // или
    // window.location.href = 'url'+id
  }
})

table {
  border-collapse: collapse;
}

td {
  border: 1px solid;
  padding: 7px;
}

<table>
  <tbody>
    <tr data-id='1'><td>первый</td></tr>
    <tr data-id='2'><td>второй</td></tr>
    <tr data-id='3'><td>третий</td></tr>
  </tbody>
</table>

БЛОГ НА HUSL

Отключить прокрутку страницы после нажатия колесиком мыши)

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