[英]Having a problem with my javascript code - computer has to guess the digit value I input
首先,我创建了一个版本,它可以在我没有在网页上输入值的情况下工作:
<p>Enter in how many fingers (between 0 and 5) you are holding up: </p>
<p>
<input id="fingersInput" type="text">
<button id="fingersSubmit">Guess!</button>
</p>
<div id="fingers-game-v2"></div>
<p id="computer-guess-results"></p>
<script type="text/javascript">
var numberOfFingers = document.getElementById("fingersInput").value;
var fingersText = "";
var correctGuesses = 0;
i = 0;
while (i < 5)
{
var computerGuess = Math.floor((Math.random()*5)+1);
fingersText += "<p>" + computerGuess + "</p>";
if (computerGuess == 3)
{
var correctGuesses = correctGuesses + 1;
}
i++;
}
document.getElementById("fingers-game-v2").innerHTML = fingersText;
document.getElementById("computer-guess-results").innerHTML = "<h3>" + "Number of times the computer guessed correctly: " + "</h3>" + correctGuesses;
</script>
然后这是我尝试创建的版本,我在网页上的输入中输入,然后计算机尝试猜测它,但是当我尝试在控制台中调试时,它根本没有执行或显示任何内容。
<p>Enter in how many fingers (between 0 and 5) you are holding up: </p>
<p>
<input id="fingersInput" type="text">
<button id="fingersSubmit">Guess!</button>
</p>
<div id="fingers-game-v2"></div>
<p id="computer-guess-results"></p>
<script type="text/javascript">
var numberOfFingers = document.getElementById("fingersInput").value;
var fingersText = "";
var correctGuesses = 0;
document.getElementById("fingersSubmit").onclick = function ()
{
i = 0;
while (i < 5)
{
var computerGuess = Math.floor((Math.random()*5)+1);
fingersText += "<p>" + computerGuess + "</p>";
if (computerGuess == numberOfFingers)
{
var correctGuesses = correctGuesses + 1;
}
i++;
}
document.getElementById("fingers-game-v2").innerHTML = fingersText;
document.getElementById("computer-guess-results").innerHTML = "<h3>" + "Number of times the computer guessed correctly: " + "</h3>" + correctGuesses;
}
我是一名初学者编码员,所以如果除了向我展示正确的代码之外,还有任何与此相关的有用知识,那么我将不胜感激!
谢谢!
这是一个工作版本,我试图尽可能接近您的原始代码:
<html> <body> <p>Enter in how many fingers (between 0 and 5) you are holding up:</p> <p> <input id="fingersInput" type="text" /> <button id="fingersSubmit">Guess!</button> </p> <div id="fingers-game-v2"></div> <p id="computer-guess-results"></p> <script type="text/javascript"> document.getElementById('fingersSubmit').onclick = function() { i = 0; var fingersText = ''; var correctGuesses = 0; var numberOfFingers = document.getElementById('fingersInput').value; while (i < 5) { var computerGuess = Math.floor(Math.random() * 5 + 1); fingersText += '<p>' + computerGuess + '</p>'; if (computerGuess == numberOfFingers) { correctGuesses = correctGuesses + 1; } i++; } document.getElementById('fingers-game-v2').innerHTML = fingersText; document.getElementById('computer-guess-results').innerHTML = '<h3>' + 'Number of times the computer guessed correctly: ' + '</h3>' + correctGuesses; }; </script> </body> </html>
您的代码无法正常工作的主要原因是因为您需要在单击按钮时获取输入值(即将其放在 onclick 中)
另一个问题是你在 if 块中重新声明了correctGuesses
,所以你应该删除var
关键字,否则你会得到 NaN
最后,严格来说这不是您的代码的问题,但是继续前进您应该意识到numberOfFingers
是一个字符串,而correctGuesses
是一个数字。 在您的 if 块中,您比较两个值并且它有效,因为您使用了==
,它只检查值。 通常更好的做法是使用===
这是一种更严格的相等性检查,比较值和类型。 因此,继续前进,您可能需要确保在进行相等检查之前将numberOfFingers
转换为数字
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.