防止Esc密钥退出网站上的FullScreen应用程序模式

Question

我正在开发一个自定义的“灯箱”照片库。我正在添加关键事件“听众”（左>＆gt;上一个，右＆gt;下一个，esc＆gt;关闭），我遇到退出全屏模式的Safari（或任何全屏模式浏览器）的问题。我的网站工作正常，只有观众必须恢复Safari（和其他人）的全屏模式。

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

有什么想法吗？

Answer 1

实际上，您无法为浏览器禁用 ESC 键，因为这对用户至少可以控制其浏览器是一种妥协。 但是，你有办法将eventlistener绑定到你的元素字段（比如你的灯箱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 键切换全屏模式。