Как я могу обнаружить событие нажатия правой кнопки мыши в mousedown? - PullRequest
Новая
       17

Как я могу обнаружить событие нажатия правой кнопки мыши в mousedown?

16 голосов
/ 01 марта 2012

Я обновляю / отлаживаю и расширяю возможности моего перетаскиваемого скрипта, и мне нужно иметь возможность достичь следующего результата: 

whatever.onRightMouseButtonMousedown = preventDefault();

Я провел много исследований, но безрезультатно, но я знаю, что это можно сделать, потому что, когда я использую jquery-ui dragggable, он не дает возможности перетаскивать элементы, когда вы нажимаете правой кнопкой мыши. Я хочу подражать этой способности и узнать, как она работает, чтобы реализовать ее сейчас и в будущем по мере необходимости.

Примечание. Пожалуйста, не предоставляйте мне информацию о том, как использовать jquery или jquery-ui (я уже знаком с ним), я хочу узнать, как они реализованы или как можно реализовать обнаружение. moussedown с правой кнопкой мыши, чтобы я мог предотвратить перетаскивание элементов с помощью правой кнопки мыши.

Ответы [ 3 ]

24 голосов
/ 01 марта 2012

Обычно, когда у вас есть какое-либо событие мыши, вам нужно, чтобы оно работало только с одним типом щелчка мыши. Поэтому события, передаваемые вашим обратным вызовам, имеют свойство, которое позволяет вам различать типы щелчков.

Эти данные передаются обратно через свойство button данных события. См. MDN , чтобы узнать, какие значения представляют какие данные.

Таким образом, вы не отключаете правый клик, вы вместо этого активируете свою функциональность только для левого клика. Вот [плохой] пример: 

element.onmousedown = function(eventData) {
  if (eventData.button === 1) {
      alert("From JS: the (left?) button is down!")
  }
}

эквивалент в jQuery: 

$("div").mousedown(function(eventData) {
    if (eventData.which === 1) {
        alert("From JQuery: which=" + de.which)
    }
});

Обратите внимание, что если вы не используете jquery, возвращаемые значения будут разными в разных браузерах. jQuery унифицирует значения в браузерах , используя 1 для левого, 2 для среднего и 3 для правого: 

 element.onmousedown = function(eventData) {
   if (eventData.button === 0) {
     console.log("From JS: the (left?) button is down!")
   }
 }

 $("#element").ready(function() {
   $("div").mousedown(function(de) {
     console.log("From JQuery: which=" + de.which);
   });
 });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="element" style="width: 100px; height: 100px; background-color: blue" />
6 голосов
/ 28 августа 2013

HTML: 

<a href="#" onmousedown="mouseDown(event);">aaa</a>​​​​​​​​​​​​​​​​​​​​​​​​​​​

JavaScript: 

function mouseDown(e) {
  e = e || window.event;
  switch (e.which) {
    case 1: alert('left'); break;
    case 2: alert('middle'); break;
    case 3: alert('right'); break; 
  }
}​

Демоверсия .

3 голосов
/ 01 марта 2012

Это не очень просто. Quirksmode.org имеет статью о свойствах события .

Смотрите в разделе "Какая кнопка мыши нажата?" / «Правый клик». Это зависит от браузера.

...