如何在网页上添加自定义右键菜单？

小编典典

如何在网页上添加自定义右键菜单？

javascript

我想向我的Web应用程序添加一个自定义的右键单击菜单。无需使用任何预建的库就可以做到吗？如果是这样，如何显示一个不使用第三方JavaScript库的简单自定义右键单击菜单？

我的目标是像Google文档那样。它允许用户右键单击并向用户显示他们自己的菜单。

注意：
我想学习如何制作自己的东西，而不是使用大多数人以来已经制作的东西，那些第三方库充斥着功能，而我只想要我需要的功能，因此我希望它完全是手工制作的我。

阅读 357

2020-04-25

共1个答案

小编典典

回答您的问题-使用contextmenu事件，如下所示：

if (document.addEventListener) {

  document.addEventListener('contextmenu', function(e) {

    alert("You've tried to open context menu"); //here you draw your own menu

    e.preventDefault();

  }, false);

} else {

  document.attachEvent('oncontextmenu', function() {

    alert("You've tried to open context menu");

    window.event.returnValue = false;

  });

}


<body>

  Lorem ipsum...

</body>

但是您应该问自己，您是否真的要覆盖默认的右键单击行为-这取决于您正在开发的应用程序。

JSFIDDLE

2020-04-25