我遇到了一個奇怪的錯誤，在我的游戲中，您輸入的猜測值大于 maxNum，例如 8 作為猜測值，輸入的 maxNum 為 10。游戲應該認為 8 大于 10。代碼的問題來自checkGuess函式。我不知道這是否是因為我使用了全域變數。
<!DOCTYPE html>
<html>
<head>
<style>
#hi-LowBody{
text-align: center;
}
#nameErrorMsg{
color: red;
}
#maxGuessError{
color: red;
}
#guessError{
color: red;
}
</style>
<script>
var nameEnteredInput;
var maxNum=0;
var minNum=1;
var randomNumber=0;
//Function :nameEnter()
//Parameters : void
//Return :
//Description: This function is the onclick and will check
function nameEntered()
{
nameEnteredInput=document.getElementById('enterNameInput').value;
if(nameCheck(nameEnteredInput)==true)
{
document.getElementById('enterNameDiv').style.display="none";
document.getElementById("maxGuessRangeDiv").style.display="block";
document.getElementById('promptByName').innerHTML="Hello <b>" this.nameEnteredInput "</b> please enter the maximum number for the game";
}
}
//Function : nameCheck()
//Parameters : name
//Return : returns true if the name entered is not blank. Returns false if the name is blank or null
//Description: This function will check the name entered to make sure it is not blank or null
function nameCheck(name)
{
if(name==null||name==""){
document.getElementById('nameErrorMsg').innerHTML='The name can not be blank. ';
return false;
}
else{
return true;
}
}
//Function : maxNumberCheck()
//Parameters :
//Returns : returns the next prompt or a error
//Description: This function will check and make sure that the number entered from the user is greater than 1. This function will also create the random number
function maxNumberCheck()
{
maxNum=document.getElementById('maxGuessRange').value;
if(maxNum<1)
{
document.getElementById("maxGuessError").innerHTML="The number you entered is less then 1 and is not allowed";
}
else
{
randomNumber=Math.floor(Math.random() * maxNum);
document.getElementById('maxGuessRangeDiv').style.display='none';
document.getElementById('guessDiv').style.display='block';
document.getElementById('promptUserToGuess').innerHTML='Please enter a guess from 1 - ' this.maxNum;
}
}
//Function : makeGuess()
//Parameters : void
//Returns :
//Description: This function will allow the user to make a guess
function makeGuess()
{
var guess=0;
guess=document.getElementById('guess1').value;
document.getElementById('promptUserToGuess').style.display='none';
if(checkGuessIsMin(guess)==false) return;
else
{
//two change range function
//1 for when the guess is greater than the random number
//2 for when the guess is less than the random number
// winner screen when the user guess the correct number
}
}
//Function :
//Parameters :
//Returns :
//Description:
//Function : checkGuessIsMin
//Parameters : guess
//Returns : returns true if the number is greater than minNum
//Description: Checks if the number is greater than the minNum
function checkGuessIsMin(guess)
{
var max=maxNum;
var min=minNum;
var guessEntered=guess;
if(guessEntered<minNum)
{
document.getElementById('guessError').innerHTML='ERROR...The number you have entered is less than <b> ' minNum '</b>';
return false;
}
else if(guessEntered>maxNum)
{
console.log('The guess is greater');
return false;
}
else return true;
}
</script>
</head>
<body id="hi-LowBody">
<h1 id="gameTitle">Hi-Low Game</h1>
<!--Enter name div-->
<div id="enterNameDiv">
<p id="nameErrorMsg"></p>
<label for="enterNameInput">Name:</label>
<input type="text" id="enterNameInput">
<input type="button" value="Submit" onclick="nameEntered()">
</div>
<!--Enter max guess range -->
<div id="maxGuessRangeDiv" hidden>
<p id="promptByName"></p>
<p id="maxGuessError"></p>
<label for="maxGuessRange">Max Guess Range</label>
<input type="number" id="maxGuessRange">
<input type="button" value="Submit" onclick="maxNumberCheck()">
</div>
<!--This is the guess prompt -->
<div id="guessDiv" hidden>
<p id="promptUserToGuess"></p>
<p id="guessError"></p>
<label for="guess">Guess:</label>
<input type="number" id="guess1">
<input type="button" value="Make Guess" onclick="makeGuess()">
</div>
</body>
</html>
uj5u.com熱心網友回復：
您從輸入value中獲得的值始終是字串（文本）。為了獲得正確的數字，parseInt如果您需要整數或parseFloat浮點數，請使用。
對于您的具體情況，代碼可能如下所示：
maxNum = parseInt(document.getElementById('maxGuessRange').value, 10);
請注意始終明確設定數字基引數（10在此示例中表示十進制），因為默認行為在未給出引數時是不安全的，并且很容易與八進制和其他數字系統混淆。
該錯誤來自這樣的代碼，這會導致true比較字串而不是數字：
'10' < '8'
請始終將用戶輸入決議為正確的數字型別，以避免意外強制。
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/506645.html
標籤：javascript html css