2017-03-09 1 views
0

Ich müsste den Rechtsklick der Maus in meinem P5Js-Canvas deaktivieren, so dass es das kleine Eigenschaftenfenster nicht öffnet, aber der Rechtsklick auf seinen eigenen kann immer noch als Eventlistener-Schlüssel verwendet werden. Wie erreicht man so etwas?Wie kann man eine Maustaste in JavaScript teilweise deaktivieren?

Beispiel: (von Dropbox)

enter image description here

Dank.

+0

Was bedeutet deaktivieren teilweise? – Legends

Antwort

0

Sie können es einfach mit jQuery abfangen und e.preventDefault() anrufen.

var c = document.getElementById("myCanvas"); 
 
var ctx = c.getContext("2d"); 
 
ctx.beginPath(); 
 
ctx.arc(95,50,40,0,2*Math.PI); 
 
ctx.stroke(); 
 

 
$("#myCanvas").on("contextmenu",function(e){ 
 
    e.preventDefault(); 
 
    // show your custom context menu here or what ever 
 
    console.log("event: right-click on canvas triggered"); 
 
})
<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width"> 
 
    <title>JS Bin</title> 
 
</head> 
 
<body> 
 
<script src="https://code.jquery.com/jquery-3.1.0.js"></script> 
 
<canvas id="myCanvas" width="200" height="100" style="border:1px solid #d3d3d3;"> 
 
</body> 
 
</html>

0

Sie können dies zu erreichen, ein Ereignis-Listener für contextmenu durch Zusatz:

document.addEventListener("contextmenu", function(e) { 
    console.log('right click!'); 
    e.preventDefault(); 
    }); 

Das console.log Stück, dass es nur zu illustrieren ist funktioniert. Sie könnten Ihre eigene Funktion erstellen, um ein nettes Kontextmenü zu erstellen.

Das e.preventDefault() verhindert, dass das Standardkontextmenü geladen wird.


document.addEventListener("contextmenu", function(e) { 
 
    console.log('right click!'); 
 
    e.preventDefault(); 
 
    });
Right click here!

Ich hoffe, das hilft.

0

if (document.addEventListener) { // IE >= 9; other browsers 
 
     document.addEventListener('contextmenu', function(e) { 
 
      alert("You've tried to open context menu"); //here you draw your own menu 
 
      e.preventDefault(); 
 
     }, false); 
 
    } else { // IE < 9 
 
     document.attachEvent('oncontextmenu', function() { 
 
      alert("You've tried to open context menu"); 
 
      window.event.returnValue = false; 
 
     }); 
 
    }
<body> 
 
Lorem ipsum... 
 
</body>

Verwandte Themen