全屏禁用所有键盘键

时间:2017-07-23 08:54:03

标签: javascript jquery

我使用一个函数在浏览器中使用javascript切换全屏模式。

function toggleFullScreen(elem) {
    // ## The below if statement seems to work better ## if ((document.fullScreenElement && document.fullScreenElement !== null) || (document.msfullscreenElement && document.msfullscreenElement !== null) || (!document.mozFullScreen && !document.webkitIsFullScreen)) {
    if ((document.fullScreenElement !== undefined && document.fullScreenElement === null) || (document.msFullscreenElement !== undefined && document.msFullscreenElement === null) || (document.mozFullScreen !== undefined && !document.mozFullScreen) || (document.webkitIsFullScreen !== undefined && !document.webkitIsFullScreen)) {
        if (elem.requestFullScreen) {
            elem.requestFullScreen();
        } else if (elem.mozRequestFullScreen) {
            elem.mozRequestFullScreen();
        } else if (elem.webkitRequestFullScreen) {
            elem.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);
        } else if (elem.msRequestFullscreen) {
            elem.msRequestFullscreen();
        }
    } else {
        if (document.cancelFullScreen) {
            document.cancelFullScreen();
        } else if (document.mozCancelFullScreen) {
            document.mozCancelFullScreen();
        } else if (document.webkitCancelFullScreen) {
            document.webkitCancelFullScreen();
        } else if (document.msExitFullscreen) {
            document.msExitFullscreen();
        }
    }
}

并创建了一个在全屏模式下禁用键盘按键的功能。 大多数按键被禁用,但仍有一些按键仍在工作(F11,ESC,ALT + Tab)。

function disable()
{

 document.onkeydown = function (e) 
 {
  return false;
 }
}

还有禁用它们吗?因为我正在开设一个在考试结束前应该全屏的在线考试。

2 个答案:

答案 0 :(得分:0)

以下是Disabling keys in Windows

的答案

您无法禁用 CTRL + ALT + DELETE 这是一个Windows特殊密钥。

你不能禁用 ALT + F4 ALT + TAB 作为特殊键。

你根本没有理由通过Javascript禁用它们。

答案 1 :(得分:0)

<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>