Javascript：当用户分配变量时崩溃'；s输入_Javascript_Loops_Crash_User Input

Javascript：当用户分配变量时崩溃'；s输入

javascript loops

Javascript：当用户分配变量时崩溃'；s输入,javascript,loops,crash,user-input,Javascript,Loops,Crash,User Input,我似乎无法理解，如果我将用户的输入分配给变量“fingers”，为什么会持续崩溃。我已经通过警报测试了代码的每一部分，一切似乎都正常。我还发现，如果我为脚本中的变量指定一个数字，它就可以正常工作我认为可能是输入值被读取为字符串，因此在比较时永远不会等于一个数字，这使得脚本进入无限循环。所以我将输入框指定为type:number，它仍然崩溃有人吗 <html> <head> <title> How Many Fing

我似乎无法理解，如果我将用户的输入分配给变量“fingers”，为什么会持续崩溃。我已经通过警报测试了代码的每一部分，一切似乎都正常。我还发现，如果我为脚本中的变量指定一个数字，它就可以正常工作

我认为可能是输入值被读取为字符串，因此在比较时永远不会等于一个数字，这使得脚本进入无限循环。所以我将输入框指定为type:number，它仍然崩溃

有人吗

<html>

        <head>
            <title> How Many Fingers - Computer Guesser </title>
        </head>

        <body>

            <h1> How many fingers? </h1>

            <input id='fingersInput' type='number' min='1' max='10' placeholder="Insert the number of fingers here." /> 

            <button id='check'> Go! </button>

            <hr> </hr>
            <p id='computerGuessesOutput'> </p>
            <p id='allguessesOutput'> </p>

        <script type='text/javascript'>

            document.getElementById('check').onclick = function() {

                var fingers = document.getElementById('fingersInput').value;

                //var fingers = 5;

                var computerGuesses = Math.floor(Math.random() * 11);

                var numberOfGuesses = 1;

                var allguesses = [computerGuesses];

                while (fingers !== computerGuesses) {
                    computerGuesses = Math.floor(Math.random() * 11);

                    numberOfGuesses++;

                    allguesses.push(computerGuesses);

                        }

                document.getElementById('computerGuessesOutput').innerHTML = numberOfGuesses;
                document.getElementById('allguessesOutput').innerHTML = allguesses;

            }



        </script>

        </body>
    </html>


多少个手指-电脑猜
有多少个手指？
走！



document.getElementById（'check'）。onclick=function（）{
var fingers=document.getElementById（'fingersInput'）.value；
//var=5；
var computerguesss=Math.floor（Math.random（）*11）；
var numberOfGuesses=1；
var allguesses=[computerGuesses]；
而（手指！==计算机猜测）{
ComputerGuess=Math.floor（Math.random（）*11）；
numberOfGuesses++；
所有猜测。推（计算机猜测）；
}
document.getElementById（'computerGuessesOutput'）。innerHTML=numberOfGuesses；
document.getElementById（'allguessesOutput'）。innerHTML=allguesses；
}

当您使用！==进行比较时，它不仅按值进行比较，而且按类型进行比较。在本例中，finger是一个字符串，而ComputerGuess是一个数字

您可以先使用parseInt（）将“fingers”转换为数字，或者使用=

您可以在控制台中更清楚地看到打印类型。看看这个：

document.getElementById（'check'）.onclick=function（）{
var fingers=document.getElementById（'fingersInput'）.value；
var computerguesss=Math.floor（Math.random（）*11）；
var numberOfGuesses=1；
var allguesses=[computerGuesses]；
控制台日志（手指、计算机猜测）；
控制台日志（手指类型、计算机猜测类型）；
}


多少个手指-电脑猜
有多少个手指？
走！

首先，它是一个输入，所以您可以像您所说的那样以文本形式获取它。

type

属性用于显示和验证，它始终是一个字符串，因为需要一个数字，所以应该执行

parseInt

将结果转换为整数

然后，您不检查您的手指值是否在随机范围内（在您的示例中为1-11），因此此范围之外的任何数字都将导致无限循环。

您试图实现什么？为了清楚起见，请解释上下文。