Как в ява скрипт при клике колёсиком мыши сделать переход?

Question

[partyzanx]

<div class="vid_materialov3" onclick="location.href = 'URL';">

Есть вот такой код, что добавить нужно, чтобы ещё и при клике колёсиком мыши было открытие этой ссылки?

Answer 1

[Igor Koch]

в html/php:

<div class="elem" data-href="<?php echo $url?>">
      Click Me!
</div>

В js:

var elem = document.querySelector('.elem'); 

elem.onmousedown = function(event) {
	if (event.button === 0 || event.button === 1){ //правая или средняя кнопка мыши
    event.preventDefault();
    window.location.href = event.target.getAttribute('data-href'); //Здесь будет выполнятся переход
  }
}

Или html inline:

<div onmousedown="if (event.button === 1){event.preventDefault(); window.location.href = '<?php echo $url?>;}">
      Click Me!
</div>

Есть еще onauxclick, но он плохо поддерживается и не работает с div

Comments

[partyzanx]

Я забыл написать "при клике колёсиком мыши". Извините

[Igor Koch]

partyzanx: https://jsfiddle.net/whata/9qtybjx0/3/

[partyzanx]

Igor Koch: а в самом html можно прописать без указания скрипта???

[Igor Koch]

partyzanx: Тоже самое можно прописать инлайном https://jsfiddle.net/whata/9qtybjx0/4/

<div class="elem" onmousedown="if (event.button === 1){event.preventDefault(); window.location.href = '/home.html';}">
      Click Me!
</div>

[partyzanx]

Igor Koch: вот эта сработала! Спасибо!

Answer 2

[Илья Белобородов]

<div class="vid_materialov3" onclick="window.location.href = 'https://google.com';"></div>

или если ссылка в переменной php

<div class="vid_materialov3" onclick="window.location.href = '<?= $url ?>';"></div>

Comments

[partyzanx]

Я забыл написать "при клике колёсиком мыши". Извините

Answer 3

[Larisa Moroz]

Колёсико отлавливаем яваскриптом:

document.querySelector('body').addEventListener('load', function () {
("click auxclick ".split(" ")).forEach(function(e){
      document.querySelector('.vid_materialov3').addEventListener(e,function (e) { if (e.type == "auxclick" || e.button == 4 || e.which == 2) location.href="https://toster.ru/q/445973"});
    });
})

Comments

[partyzanx]

Я забыл написать "при клике колёсиком мыши". Извините

[Larisa Moroz]

partyzanx: поправила для колёсика

[partyzanx]

Larisa Moroz: а в самом html можно прописать без указания скрипта???

[Larisa Moroz]

partyzanx: нет, только через javascript

[partyzanx]

Larisa Moroz: можно вот так

<div onmousedown="if (event.button === 1){event.preventDefault(); window.location.href = '<?php echo $url?>;}">
      Click Me!
</div>

Answer 4

[twobomb]

Мне кажется правильней будет так

<a href="$ENTRY_URL$">
   <div class="vid_materialov3">
   </div>
</a>

Comments

[partyzanx]

по некоторым причинам такое решение не подходит