防止 Esc 键退出网站上的全屏应用程序模式

Question

我正在开发一个自定义“灯箱”照片库。我正在添加关键事件“侦听器”（左>上一个、右>下一个、esc>关闭），并且我遇到了 Safari（或任何全屏模式浏览器）在转义时退出全屏模式的问题。我的网站工作正常，只是查看器必须恢复 Safari（和其他）的全屏模式。

现在，我知道有办法绕过它。例如，在“剧院”模式下查看照片时，可以使用 esc 键关闭 Facebook，而不会导致我的浏览器退出全屏。

有什么想法吗？

Answer 1

实际上，您不能为浏览器禁用 ESC 键，因为这是一种妥协，用户至少可以对其浏览器进行一些控制。 但是，您确实有办法将事件侦听器绑定到您的元素字段（例如您的灯箱 div）以在按下 Esc 并抑制它时捕获事件，如下所示：（所以当人们按下 ESC 在画廊 div 上它不会退出浏览器全屏）

document.querySelector("div.lightbox").addEventListener("keydown",function(e){
    var charCode = e.charCode || e.keyCode || e.which;
    if (charCode == 27){
         alert("Escape is not suppressed for lightbox!");
        return false;
    }
});

现在也有许多浏览器使用 F11 键切换全屏模式。