Question

我需要在我的p5js画布中禁用右键单击鼠标，这样它就不会显示小属性窗口，但右键单击它自己仍然可以用作eventlistener键。如何实现这样的目标？

示例:(来自dropbox）

感谢。

Answer 1

您可以使用jQuery轻松拦截它并调用e.preventDefault()。

＆＃13;

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

＆＃13;

<!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>

＆＃13;

Answer 2

您可以通过为contextmenu添加事件侦听器来实现此目的：

  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!

我希望这会有所帮助。

Answer 3

＆＃13;

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

＆＃13;

<body>
Lorem ipsum...
</body>

＆＃13;

如何在javascript中部分禁用鼠标按钮？

3 个答案: