2017-03-09 3 views
0

私はp5jsキャンバス内でマウスの右クリックを無効にする必要があるので、小さなプロパティウィンドウは表示されませんが、独自の右クリックはeventlistenerキーとして使用できます。 このようなことはどのように達成するのですか?JavaScriptでマウスボタンを部分的に無効にする方法はありますか?

例:(ドロップボックスから)

enter image description here

おかげ。

+0

? – Legends

答えて

0

jQueryで簡単に代行受信でき、e.preventDefault()と呼ぶことができます。

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

あなたは、コンテキストメニューのイベントリスナーを追加することによって、これを達成することができます

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

にconsole.log作品はちょうどそれが動作していることを説明することです。素晴らしいコンテキストメニューを作成する独自の関数を構築することができます。

e.preventDefault()は、デフォルトのコンテキストメニューが読み込まれないようにするものです。


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

私はこのことができます願っています。部分的に無効にする意味は何

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>

関連する問題