シンプルな推測ゲーム

私は単純な推測ナンバーゲームを作ろうとしています。私は正しく動作する機能を得ることができない、または私のメッセージをユーザーに表示することはできません。 innerHTMLを正しく使用していませんか？また、数字が正しく推測されたときにゲームをリロードしたい場合は、ゲームが動作しないために動作するかどうかわかりません。シンプルな推測ゲーム

<!DOCTYPE html> 
<html> 
    <head lang="en"> 
     <meta charset="utf-8"> 
     <title>Guess the Number</title> 
     <link rel="stylesheet" href="css/Lab6.css" /> 
     <script type="text/javascript" src="script/Lab6.js"></script> 
    </head> 
    <body onload="pickInteger()"> 
     <div> 
     <h2><strong>Guess the Number</strong></h2> 
     </div> 
     <br/> 
     <div id="formDiv"> 
     <form name="AForm" method="get" > 
      <p>The computer has picked a number between 1 - 99, you must choose the correct number to win the game. When you guess the right number the game will restart.<br/> 
      </p> 
      <div id="bodyDiv"> 
       <p> Your guess is: 
        <input id="guess" type="text" size="1" name="theData" value="" autofocus/> 
        <input type="button" name="mybutton" value=" Guess " onclick="checkGuess()"> 
       </p> 
       <p id="output"> 
       </p> 
      </div> 
     </form> 
     </div> 
    </body> 
</html> 

var number = 0; 
var output = document.getElementById("output").innerHTML; 

function pickInteger() { 
    "use strict"; 
    number = Math.floor(Math.random() * 10 + 1); 
} 

function checkGuess() { 
    "use strict"; 

    var guess = document.getElementById("guess").value; 
     if (guess == number) { 
      alert(number + " " + "Is the correct number!"); 
      output = ""; 
      pickInteger(); 
     } 
     if (guess < number); { 
      output = "The number I am thinking of is higher than" + guess; 
     } 
     else if (guess > number); { 
      output = "The number I am thinking of is lower than" + guess; 
     } 
}

出典

2017-12-03 Ryan Robertson

あなたのコードの下に表示さを持っていましたあなたのコードの要素のHTMLはここにあります。 – ceejayoz

あなたは間違っているセミコロンif (guess < number);とelse if (guess > number);ちょうどそれを削除し、それが作業を開始します、 `出力=`変更されません設定

var number = 0; 
 
var output = document.getElementById("output").innerHTML; 
 
var consolecounter = 0; 
 

 
function pickInteger() { 
 
    "use strict"; 
 
    number = Math.floor(Math.random() * 10 + 1); 
 
} 
 

 

 
$(document).ready(function() { 
 
    pickInteger(); 
 
    $("form[name='AForm']").on('submit', function(e) { 
 
    "use strict"; 
 
    e.preventDefault(); 
 
    var guess = parseInt(document.getElementById("guess").value); 
 
    if (guess == number) { 
 
     alert(number + " " + "Is the correct number!"); 
 
     output = ""; 
 
     pickInteger(); 
 
    } 
 

 
    if (guess < number) { 
 
     console.log("The number I am thinking of is higher than " + guess); 
 
     consolecounter++; 
 
    } else if (guess > number) { 
 
     console.log("The number I am thinking of is lower than " + guess); 
 
     consolecounter++; 
 
    } 
 
    clearConsole(consolecounter); 
 
    }) 
 
}) 
 

 

 

 
function clearConsole(consolecounter) { 
 
    (consolecounter == 3) && (setTimeout(function() { 
 
    console.clear(); 
 
    consolecounter = 0; 
 
    }, 2000)); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<!DOCTYPE html> 
 
<html> 
 

 
<head lang="en"> 
 
    <meta charset="utf-8"> 
 
    <title>Guess the Number</title> 
 

 
</head> 
 

 
<body> 
 
    <div> 
 
    <h2><strong>Guess the Number</strong></h2> 
 
    </div> 
 
    <br/> 
 
    <div id="formDiv"> 
 
    <form name="AForm" method="get"> 
 
     <p>The computer has picked a number between 1 - 99, you must choose the correct number to win the game. When you guess the right number the game will restart.<br/> 
 
     </p> 
 
     <div id="bodyDiv"> 
 
     <p> Your guess is: 
 
      <input id="guess" type="text" size="1" name="theData" value="" autofocus/> 
 
      <input type="submit" name="mybutton" value=" Guess "> 
 
     </p> 
 
     <p id="output"> 
 
     </p> 
 
     </div> 
 
    </form> 
 
    </div> 
 
</body> 
 

 
</html>

出典

2017-12-03 02:17:43

答えて

関連する問題