简体   繁体   English

如何在 Javascript 中禁用 esc 和 window 键

[英]How to disable esc and window keys in Javascript

I want when user enables full screen mode then user can't use any keyboard key, which means I will disable all keys when user enter in full screen mode.我希望当用户启用全屏模式时用户不能使用任何键盘键,这意味着当用户进入全屏模式时我将禁用所有键。 Please help me to solve this problem.请帮我解决这个问题。

<pre><!DOCTYPE html>
<html>
 <head>
  <title>Page Title</title>
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

    <script type="text/javascript">

      $(document).ready(function ()
       {
          $(document).keydown(function (event) {
          return false;
       });
    });
      document.oncontextmenu = function (e)        //check for the right click
     {
       return false;
     }
    document.ondragstart = function (e)
   {
     return false;
   }

   function toggleFullScreen() {

       var docElm = document.documentElement;
       if ((document.fullScreenElement && document.fullScreenElement !== null) ||(!document.mozFullScreen && !document.webkitIsFullScreen)) {
                                    if (docElm.requestFullscreen) {
                                        docElm.requestFullscreen();
                                    }
                                    else if (docElm.mozRequestFullScreen) {
                                        docElm.mozRequestFullScreen();
                                    }
                                    else if (docElm.webkitRequestFullScreen) {
                                        docElm.webkitRequestFullScreen();
                                    }
                                }
                                else {


                                    if (document.exitFullscreen) {
                                        document.exitFullscreen();
                                    }
                                    else if (document.mozCancelFullScreen) {
                                        document.mozCancelFullScreen();
                                    }
                                    else if (document.webkitCancelFullScreen) {
                                        document.webkitCancelFullScreen();
                                    }



                                }
                            }

    </script>
    </head>
    <body>

    <h1>This is a Heading</h1>
     <p>This is a paragraph.</p>
     <input type=text id="text"/>
     <button onclick="toggleFullScreen()" value="toggleFullScreen" 
      name="toggleFullScreen">toggleFullScreen</button>

  </body>
</html>

 </pre>

In above code I will add a toggler button to enable full screen mode and also place code for disable keyboard key full screen mode will be work and keyboard key is also working but ESC and Window key can't be disabled.在上面的代码中,我将添加一个切换按钮以启用全屏模式,并放置用于禁用键盘键全屏模式的代码,并且键盘键也在工作,但 ESC 和 Window 键不能被禁用。 Please help me to solve this problem.请帮我解决这个问题。

Update your keydown code as follows更新您的keydown代码如下

   $(document).ready(function () {
      $(document).keydown(function (event) {
        var charCode = event.charCode || event.keyCode || event.which;
        if (charCode == 27 || charCode == 91 || charCode == 92) {
          alert("Escape and window keys are not allowed");
          return false;
        }
      });
    });

Well, if-else always looks a good idea in this situation but I will prefer this way.好吧,在这种情况下if-else总是看起来不错,但我更喜欢这种方式。 More readable and better approach更具可读性和更好的方法

document.attachEvent("onkeydown", win_onkeydown_handler);

function win_onkeydown_handler() {
    switch (event.keyCode) {

    case 91: // 'Left Window'
         event.returnValue = false;
         event.keyCode = 0;
         break;  

    case 27: // 'Esc'
        event.returnValue = false;
        event.keyCode = 0;
        break;

    case 92: // 'Right Windows'
        event.returnValue = false;
         event.keyCode = 0;
         break;
        break;

    }
}

Modify it the way you want and you can see full list of key codes here以您想要的方式修改它,您可以在此处查看完整的关键代码列表

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM