Advertisement
TJSJ

guessgame

Jan 21st, 2018
406
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.00 KB | None | 0 0
  1. <!doctype html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>Sample Javascript Guessing Game</title>
  6.  
  7. <script src="guessgame.js"></script>
  8. </head>
  9.  
  10. <body>
  11. <h1> Guess the Number! </h1>
  12. <fieldset>
  13. <legend>Inputs</legend>
  14. <label for="guess">Your Guess:</label>
  15. <input type="text" id="guess" value="523" />
  16. <input type="button" onclick="yourGuess()" value="submit" /><br />
  17. <input type="button" id="showguesses" onclick="showGuesses()" value="Show My Guesses" />
  18. <input type="button" onclick="generateNumberToGuess(true)" value="New Game" /><br />
  19. <input id="cheat" type="checkbox" value="cheat" onclick="showNumberToGuess()" />
  20. <label for="cheat">Cheat</label>
  21. <div id="cheatShow" style="display: none;">
  22. <input id="numberToGuess" type="text" />
  23. <label for="numberToGuess">Number to guess</label>
  24. </div>
  25. </fieldset>
  26. <fieldset id="guesses" class="guesses">
  27. <legend> Output </legend>
  28. <textarea id="output" name="output" rows="5" style="width: 100%;"></textarea>
  29. </fieldset>
  30.  
  31. </body>
  32. </html>
  33.  
  34. // JAVA SCRIPT //
  35. // guessgame.js //
  36.  
  37. var elOutput = document.getElementById('output');
  38.  
  39. function generateNumberToGuess() {
  40. numberToGuess = Math.floor(Math.random() * 1000) + 1;
  41. }
  42.  
  43. function showNumberToGuess() {
  44.  
  45. }
  46.  
  47. function showGuesses() {
  48. elOutput = document.getElementById('output');
  49. elOutput.innerHTML += ''
  50. }
  51.  
  52. function yourGuess() {
  53.  
  54. var elGuess = document.getElementById('guess');
  55.  
  56. if (elGuess.value === numberToGuess) {
  57. elOutput.innerHTML += '<p>You guess the number correctly! Which was: ' + numberToGuess + '<br /></p>'
  58. }
  59.  
  60. if (elGuess.value < numberToGuess) {
  61. elOutput.innerHTML += '<p>You guess incorrectly. The number is more. <br /></p>'
  62. }
  63.  
  64. if (elGuess.value > numberToGuess) {
  65. elOutput.innerHTML += '<p>You guess incorrectly. The number is less. <br /></p>'
  66. }
  67. // You can store references to the value and the
  68. // guesses textarea in local function variables.
  69.  
  70. }
  71.  
  72. window.onload = function(){
  73. generateNumberToGuess();
  74. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement