Rileva il tasto sinistro del mouse premi

Question

Odio questo casino con i pulsanti del mouse creati da W3C e MS! Voglio sapere se il tasto sinistro del mouse viene premuto quando ottengo un evento da mouse.

Io uso questo codice

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

Tuttavia, non funziona in Opera e Chrome, perché si dà il caso che window.event esiste anche lì.

Quindi cosa devo fare? Ho qualche rilevamento del browser, ma sappiamo tutti che non si può fare affidamento su tutto il mascheramento che alcuni browser fanno ultimamente. Come posso rilevare il pulsante sinistro del mouse AFFIDABILE?

Answer 1

Risposta aggiornata. Di seguito rileverà se la sinistra e si preme solo il tasto sinistro del mouse:

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

Per molte più informazioni sulla gestione degli eventi del mouse in JavaScript, provare http://unixpapa.com/js/mouse.html

Answer 2

V'è ora una proprietà W3C standardevent.buttons supportato da IE9 in standards mode e Gecko 15+.

Il W3C completely stuffed la proprietà event.button, quindi per una conforme agli standard event.button browser è 0, ma per i browser creati prima lo standard, event.button è 1.

Così codice must evitano il ricorso event.button tranne per i browser più vecchi. Il seguente codice dovrebbe funzionare:

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

Answer 3

È possibile utilizzare il seguente code-

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

Answer 4

Anche se event.buttons ora lavora in Chrome, Safari continua a non supporta. Una soluzione è quella di utilizzare onMouseDown e onmouseup eventi a documento o livello padre come: onmousedown = "bMouseDown = true" onmouseup = "bMouseDown = false"

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

Spiegazione: quando il mouse è in basso, si cambia a true la premuto il pulsante nella nostra serie di pulsanti. Quando il mouse è attivo, passiamo a falso il pulsante premuto su falso.

Ora possiamo stabilire quale pulsante viene premuto in modo più accurato, ma abbiamo un problema con il tasto destro del mouse .. perché con quel pulsante apriamo un menu di contesto nel browser e questo sfugge al nostro controllo ... quindi disabilitiamo il contesto menu per rilevare correttamente il clic destro. Se non lo facciamo, dobbiamo risolvere anche il clic sinistro ... ed è una complicazione che sfugge a questa risposta.

Per semplificare le cose, è possibile aggiungere un'altra variabile mousePressed e contrassegnare se il mouse è inattivo o inattivo.

Funziona perfettamente su chrome, non l'ho provato in altri browser ma immagino sia ok anche in firefox e opera ... IE ??? Non mi importa di IE.

Buon divertimento!

Answer 6

Lavorare off di robocat's answer, si potrebbe facilmente creare un'estensione jQuery come il seguente

$.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; 
}