通過javascript和keyevent從一個HTML頁面移至下一個HTML頁面

Question

通過僅使用JS / HTML，我想檢測空格鍵是否被擊中，以及當它被擊中時，我想將html更改為另一個文件。 （注意，我只是在本地主機上工作，所以我想從本地主機：1337轉到本地主機：1337 / mainmenu）

這就是我所擁有的，但是似乎存在一個潛在的問題。 我有一個index.html文件和一個index.js文件。 我的js文件中有一個腳本，允許文本淡入和淡出。 該腳本運行良好。 但是，當我為鍵盤事件添加腳本時，第一個腳本似乎停止工作。

有人可以指出這兩個腳本是否相互干擾？ 另外，有人可以解釋為什么我的鍵盤腳本無法運行嗎？

JS：

var speed = 1000; 
var t = setInterval(function(){
  var slideSource = document.getElementById('play');
  slideSource.classList.toggle('fade');
}, speed);

//SEPERATE SCRIPTS
window.addEventListener("keydown", pressToPlay, false);
function checkSpacebar(e) {
    if(e.keyCode == "32") {
        window.location.href = "localhost:1337/mainmenu";
    }
}

HTML：

<html>
<body>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
    <div class="container">
    <img src="images/image.jpg" alt="Loading Image.." style="width:100%;height:100%;">
    <div class="title">
    <img src = "images/redfox.png" style = "width:7%">
    Oregon Trail:Marist Edition 
    <div class = "marist"><img src = "images/marist.png" style = "width:15%"></div>
    <img src = "images/redfox.png" style = "width:7%"></div>
    <div id ="play">Press Spacebar To Play!</div>
    </div>
    <link rel="stylesheet" type="text/css" href="/css/index.css">
    <script src="/JS/index.js" type="text/javascript"></script>
    </body>
    </html>

Answer 1

//SEPERATE SCRIPTS
    window.addEventListener("keydown", checkSpaceBar, false);
    function checkSpaceBar(e) {
        if(e.keyCode == "32") {
            window.location.href = "localhost:1337/mainmenu";
        }
    }

縮小了ES6樣式

window.addEventListener("keydown",(e) => {if(e.keyCode === 32) window.location.href="localhost:1337/mainmenu";}, false);

Answer 2

你有你的一些錯誤JavaScript代碼，你傳遞一個未定義的變量（實際上是一個回調函數）的keydown事件監聽器，你一開始的字符串" ，並關閉' ，並產生一個意外標記錯誤，從而您的代碼將崩潰，因此您不應同時使用"或'兩者。

這是經過必要修改的代碼：

// your passing an undefined pressToPlay function instead of checkSpacebar
window.addEventListener("keydown", checkSpacebar, false);

function checkSpacebar(e) {
    // use "32" or '32' and as of the keyCode attribute is an integer then no need to use 32 as a string, I mean instead of "32" write just 32.
    if(e.keyCode == 32) {
        window.location.href = "localhost:1337/mainmenu";
    }
}

希望我能進一步推動您。

Answer 3

在網址前添加Http。

    window.addEventListener("keydown", checkSpaceBar, false);
        function checkSpaceBar(e) {
            if(e.keyCode == "32") {
               window.open('http://localhost:1337/mainmenu',"_self");
            }
        }

通過javascript和keyevent從一個HTML頁面移至下一個HTML頁面

問題描述

3 個解決方案

解決方案1
1 2018-09-26 21:53:21

解決方案2
0 2018-09-26 22:05:54

解決方案3
0 2018-09-26 22:59:19

通過javascript和keyevent從一個HTML頁面移至下一個HTML頁面

問題描述

3 個解決方案

解決方案1 1 2018-09-26 21:53:21

解決方案2 0 2018-09-26 22:05:54

解決方案3 0 2018-09-26 22:59:19

解決方案1
1 2018-09-26 21:53:21

解決方案2
0 2018-09-26 22:05:54

解決方案3
0 2018-09-26 22:59:19