Wie kann ich das Rechtklickereignis in JavaScript erfassen?

160

Ich möchte die Standardkontextmenüs blockieren und das Rechtklickereignis manuell behandeln.Wie kann ich das Rechtklickereignis in JavaScript erfassen?

Wie wird das gemacht?

Quelle

2010-11-20 Giffyguy

@systempuntoout Nein, das ist eine andere Frage. Die andere Frage möchte "Rechtsklick ohne Javascript zu blockieren", diese Frage möchte einfach mit Funktionalität erweitert werden (viele Websites tun dies ohne lästige Benutzer erfolgreich, z. B. Google Docs) – bobobobo

@Bobobobo: Das stimmt. Ich strebe eine UI-Erweiterung an, keine Einschränkung. – Giffyguy

Strg + Klick oder Cmd + Klick sind auch gültige Szenarien dafür. Obwohl es eng mit dem rechten Mausklick verbunden ist, scheint dies kein vollständiges Duplikat zu sein, da das Kontextmenü nicht mit der rechten Maustaste behandelt wird. Rechtsklick ist im Kontextmenü enthalten, nicht umgekehrt. –

234

Verwenden oncontextmenu Ereignis.

Hier ist ein e xample:

<div oncontextmenu="javascript:alert('success!');return false;"> 
    Lorem Ipsum 
</div>

Und mit Event-Listener:

el.addEventListener('contextmenu', function(ev) { 
    ev.preventDefault(); 
    alert('success!'); 
    return false; 
}, false);

Vergessen Sie nicht falsch zurück, andernfalls wird die Standardkontextmenü öffnet sich nach wie vor.

Wenn Sie eine Funktion verwenden möchten, die Sie anstelle von javascript:alert("Success!") geschrieben haben, denken Sie daran, in der Funktion AND und dem Attribut oncontextmenu false zurückzugeben.

Quelle

2010-11-21 03:29:52 Chase

+52

Verwenden von Ereignislistenern: 'elt.addEventListener ('Kontextmenu', Funktion (ev) {ev.preventDefault(); Warnung ('Erfolg!'); Rückgabe false;}, false); ' – rampion

Großartiger Code +1, ich fand sogar einen schlankeren Weg. 'oncontextmenu = "chatMenu (event)" dann benutze einfach e.preventDefault (e), wenn du es in chatMenu übergibst: D Auf diese Weise wird das; return false; muss nicht für jedes neue Element (z. B. für Chat-Protokolle oder whatnot) übergeben werden. –

Dies ist nur für den Rechtsklick geeignet. Wenn Sie einen Ereignishandler für alle Arten von Klicks benötigen, verwenden Sie den obigen Code in Verbindung mit den folgenden: 'var onMousedown = function (e) { if (e.which === 1) {/ * Linke Maustaste * /} sonst if (e.which === 3) {/ * Rechte Maustaste * /} /*etc.*/ }; clickArea.addEventListener ("mousedown", onMousedown); 'Der Kontextmenü-Listener lässt das Rechtsklick-Ereignis zu. Denken Sie daran, dass auf Mac FF * Strg + Rechtsklick * als linke Maustaste durchkommen wird, aber auf Mac Chrome * Strg + Rechtsklick * wird als rechte Maustaste durchkommen. –

Ich denke, dass man für so etwas suchen:

function rightclick() { 
    var rightclick; 
    var e = window.event; 
    if (e.which) rightclick = (e.which == 3); 
    else if (e.button) rightclick = (e.button == 2); 
    alert(rightclick); // true or false, you can trap right click here by if comparison 
}

(http://www.quirksmode.org/js/events_properties.html)

Und dann die onmousedown verwenden, auch mit der Funktion Rechtsklick() (wenn Sie es verwenden global auf möchten ganze Seite können Sie dies <body onmousedown=rightclick(); >

Quelle

2010-11-20 23:04:17

Ich glaube, du meintest 'if ((e.which && e.which == 3) || (e.button && e.button == 2))'. – Shea

oder einfach (e.which === 3 || e.button === 2) – ansiart

das ist alte Schule, aber es funktioniert fast überall. – nekavally

Wie kann ich das Rechtklickereignis in JavaScript erfassen?

Antwort

Verwandte Themen