Обнаружить нажатие левой кнопки мыши

Я ненавижу этот беспорядок с помощью кнопок мыши, созданных W3C MS! Я хочу знать, нажата ли левая кнопка мыши, когда я получаю событие mousedown.

Я использую этот код

// Return true if evt carries left mouse button press
function detectLeftButton(evt) {
  // W3C
  if (window.event == null) {
    return (evt.button == 0)
  }
  // IE
  else {
    return (evt.button == 1);
  }
}

Однако он не работает в Opera и Chrome, потому что так бывает, что window.event существует и там.

Так что мне делать? У меня есть обнаружение браузера, но мы все знаем, что на него нельзя полагаться со всеми масками, которые некоторые браузеры делают в последнее время. Как определить левую кнопку мыши RELIABLY?

Ответ 1

Обновлен ответ. Следующее обнаружит, нажата ли левая и только левая кнопка мыши:

function detectLeftButton(evt) {
    evt = evt || window.event;
    if ("buttons" in evt) {
        return evt.buttons == 1;
    }
    var button = evt.which || evt.button;
    return button == 1;
}

Для получения более подробной информации об обработке событий мыши в JavaScript попробуйте http://unixpapa.com/js/mouse.html

Ответ 2

Теперь существует стандарт W3C event.buttons, поддерживаемый IE9 в режиме стандартов, и Gecko 15+.

W3C полностью наполнил свойством event.button, поэтому для браузера с поддержкой стандартов event.button равно 0, но для браузеров, созданных до стандартного события. кнопка 1.

Поэтому код должен избегать использования event.button, за исключением старых браузеров. Следующий код должен работать:

function detectLeftButton(event) {
    if ('buttons' in event) {
        return event.buttons === 1;
    } else if ('which' in event) {
        return event.which === 1;
    } else {
        return event.button === 1;
    }
}

Ответ 3

Вы можете использовать следующий код -

onmouseup="if(window.event.which==1){//code for left click}
           else if(window.event.which==3){//code for right click}"

Ответ 4

Даже несмотря на то, что в Chrome теперь работает функция event.buttons, Safari по-прежнему не поддерживает ее. Одним из способов является использование onmousedown и onmouseup событий на уровне документа или родителя, например: onmousedown = "bMouseDown = true" onmouseup = "bMouseDown = false"

Ответ 5

// 0 left, 2 right, 1 middle, other.. extra buttons, gaming mouses

var buttonsArray = [false, false, false, false, false, false, false, false, false];
var mousePressed = false;

document.onmousedown = function(e) {
    buttonsArray[e.button] = true;
    mousePressed = true;
};

document.onmouseup = function(e) {
    buttonsArray[e.button] = false;
    mousePressed = false;
};

document.oncontextmenu = function() {
    return false;
}

Объяснение: Когда мышь опущена, мы переходим к истине нажатой кнопки в нашем массиве кнопок. Когда мышь поднята, мы перейдем к ложной нажатой кнопке к false.

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

Чтобы упростить вещи, мы можем добавить еще одну переменную mousePressed и флаг, если мышь указана вниз или вверх.

Прекрасно работает на хроме, я не тестировал его в другом браузере, но я думаю, его хорошо в firefox и opera тоже... IE??? Меня не волнует IE.

Наслаждайтесь!

Ответ 6

Отключение robocat answer, вы можете легко создать расширение jQuery, например следующее

$.fn.mouseButton = function() {
    if (!(this instanceof MouseEvent || this[0] instanceof MouseEvent)) return null;
    var e = this[0] || window.event;
    return e.buttons || e.which || e.button;
}