Jquery 关闭画布菜单打开时是否禁用页面交互（如链接、输入）？

我有一份非画布菜单。当您打开菜单时，仍然可以看到少量的正常页面内容。单击或轻触此区域时，菜单关闭

当正常内容为文本和图像时，此功能正常工作。然而，当它是一个链接时，链接就会被跟踪，如果它是一个输入，那么输入就会被激活

菜单打开时，如何禁用链接、输入等？我可以用JavaScript（我使用的是jQuery）实现这一点吗

JavaScript非常简单。我只是在单击或点击菜单时切换一个类，然后用CSS设置页面动画

  $('.off-canvas-menu-trigger').click(function() {
    $('body').toggleClass('off-canvas-menu-is-open');
  });

  $('.page-content').click(function() {
    $('body').removeClass('off-canvas-menu-is-open');
  });

---

它不是JavaScript，但最好的解决方案是使用CSS禁用整个div及其上下文，使其不可单击：

pointer-events: none

可能是这样的：