添加 keydown 事件侦听器阻止我通过在 chrome 中按 F-12 来检查 HTML 元素

Question

正如标题所说，当我在 javascript 中添加一个 keydown 事件侦听器时，按 F-12 将不起作用。

        window.addEventListener("keydown", function (event) {
            if (event.defaultPrevented){
                return;
            }

            if (event.key == "w" || event.key == "ArrowUp"){
                console.log("test");
            }

            event.preventDefault();
        }, false);

这是我必须在我的 HTML 脚本标签中添加的唯一内容，以防止 F-12 工作。事件侦听器正在工作，我正在使用最新版本的 chrome。我也在导入 THREE.js 但不导入它不会改变任何东西。

这里是完整的原始 HTML 代码，如果有的话。

<!DOCTYPE html>
<html>
    <head>
        <meta charset=utf-8>
        <title>My first three.js app</title>
        <!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/98/three.min.js"></script> -->
        <style>
            body{
                margin-top: 20px;
                display: flex;
                justify-content: center;
                align-items: center;
            }
        </style>
    </head>
    <body>
        <!-- <script src="script.js"></script> -->
        <script>

            window.addEventListener("keydown", function (event) {
                if (event.defaultPrevented){
                    return;
                }

                if (event.key == "w" || event.key == "ArrowUp"){
                    console.log("test");
                }

                event.preventDefault();
            }, false);

        </script>
    </body>
</html>

Answer 1

防止默认（）；防止默认行为

添加 keydown 事件侦听器阻止我通过在 chrome 中按 F-12 来检查 HTML 元素

adding a keydown event listener prevents me from checking HTML elements by pressing F-12 in chrome

html

javascript

keyboard

google-chrome

addeventlistener