setTimeout的自定義用戶輸入

Question

我是一個學習Java腳本的初學者，我需要一些幫助...我正在嘗試制作游戲，我希望用戶能夠設置自己的時間。

我的代碼如下：

HTML：

<div class='wrapper'>
<form id='nameForm'>
    <div class='form-uname'>
        <lable id='nameLable' for='nameField'>Create a username:</lable>
        <input id='nameField' type='text' maxlength='25'></input>
    </div>
    <div class='form-sub'>
        <button id='subButton' type='button'>Print your name!</button>
    </div>
</form>

<div>

JavaScript：

function getUserName() {
var nameField = document.getElementById('nameField').value;

    alert(nameField);
}
var subButton = document.getElementById('subButton');
subButton.addEventListener('click', getUserName, false);

警報值正確！ 但是，當我將變量nameField放在下面的代碼中而不是1000 （請參閱最后一行）時，它不起作用！

var Timer = window.setTimeout;
$shape.onclick = function(){
    window.clearTimeout(Timer);
    Timer = window.setTimeout(function(){
        $gameOverp.innerHTML = "You run out of time :( <br /> GAME OVER!";
        passedTime();
        $gameOver.style.display = "block";
        $shape.style.display = "none";
        $gameInfop.innerHTML = "TRY AGAIN!";
        $gameInfop.style.marginLeft = "280px";
}, 1000);

我知道我在函數內創建了nameField ，但是即使我在文件的開頭創建它，它也不起作用。

當我使用x = 3000並放置x而不是1000 ，它可以正常工作。

我希望你們能理解我的問題，如果您有任何問題，我將很樂意為您解答！

Answer 1

您在這里遇到的是數據類型問題。 超時功能需要數字數據類型（例如3000），並且您的變量默認為字符串 （“ 3000”-注意引號）。

您可以使用Number()函數將字符串轉換為數字，如下所示：

nameField = Number(nameField);

不過，有一個更簡單的解決方案：您可以將輸入類型從“文本”更改為“數字”，這將驗證數字輸入並將該值默認注冊為數字數據類型。 MDN：HTML數字輸入

有關數據類型的更多信息： MDN Javascript數據類型