javascript - Detectar pulsando el botón izquierdo del ratón.

google-chrome key

Question

¡Odio este lío con los botones del mouse creados por W3C y MS! Quiero saber si se presiona el botón izquierdo del mouse cuando se produce un evento de ratón.

Yo uso este código

// 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);
  }
}

Sin embargo, no funciona en Opera y Chrome, porque sucede que window.event existe allí también.

¿Entonces qué hago? Tengo cierta detección del navegador, pero todos sabemos que no se puede confiar con todo el enmascaramiento que algunos navegadores realizan últimamente. ¿Cómo detecto el botón izquierdo del ratón CONFIABLE?

Answer 1

A pesar de que event.buttons ahora funciona en Chrome, Safari todavía no lo admite. Una solución es usar los eventos onmousedown y onmouseup a nivel de documento o padre, como: onmousedown = "bMouseDown = true" onmouseup = "bMouseDown = false"

Answer 2

Ahora hay una propiedad event.buttons estándar de W3C admitida por IE9 en modo estándar y Gecko 15+ .

El W3C rellenó completamente la propiedad event.button, por lo que para un navegador compatible con event.button es 0, pero para los navegadores creados antes de la norma, event.button es 1.

Por lo tanto, el código debe evitar el uso de event.button excepto para los navegadores más antiguos. El siguiente código debería funcionar:

function detectLeftButton(event) {
    if (event.metaKey || event.ctrlKey || event.altKey || event.shiftKey) {
        return false;
    } else if (''buttons'' in event) {
        return event.buttons === 1;
    } else if (''which'' in event) {
        return event.which === 1;
    } else {
        return (event.button == 1 || event.type == ''click'');
    }
}

Answer 3

Puedes usar el siguiente código

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

Answer 4

Respuesta actualizada. Lo siguiente detectará si se presiona el botón izquierdo y solo el botón izquierdo del ratón:

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

Para obtener más información sobre el manejo de eventos del mouse en JavaScript, visite http://unixpapa.com/js/mouse.html

Answer 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;
}

Explicación: cuando el mouse está abajo, cambiamos a verdadero el botón presionado en nuestra matriz de botones. Cuando el mouse está arriba, cambiamos a falso el botón presionado a falso.

Ahora podemos establecer qué botón se presiona con mayor precisión, pero tenemos un problema de clic con el botón derecho ... porque con ese botón abrimos un menú contextual en el navegador, y eso escapa a nuestro control ... así, deshabilitamos el menú contextual para Detecta correctamente el click derecho. Si no lo hacemos, debemos resolver el clic izquierdo también ... y es una complicación que escapa a esta respuesta.

Para simplificar las cosas, podemos agregar otra variable mousePressed y marcar si el mouse está arriba o abajo.

Funciona perfectamente en Chrome, no lo probé en otro navegador pero supongo que está bien en Firefox y Opera también ... ¿IE? No me importa IE.

¡Disfrútala!