TutorialMeta
Ad

How Do I Decrement The Value In My Java Script Code?

- 1 answer

The code below is for "guess the number game" in a web page where the user is the one thinking of the number and the Computer is to guess the number that users are thinking. So I need to know how to automatically decrease the value (number) in the "Guesses Remaining" input field.

<html>

<head>
   <meta charset="UTF-8">
   <script src="lab1a.js"></script>
</head>


<body>
Guess a number game: <br/> <br/>

Upper Bound: <input id="UPPER"  type="text"></input> <br/>
Lower Bound: <input id="LOWER" type="text"></input> <br/>
Guesses Remaining: <input id="REMAINING" type="text"></input> <br/>

<button onclick="play()">Play!</button>  <br/>

Computer's Guess: <span id="COMP_GUESS"></span> <br/>

<button onclick='high("GUESS_HIGHER")'>Guess Higher</button>
<button onclick="low('GUESS_LOWER')">Guess Lower</button>
<button disabled=true onclick="correct()" id="CORRECT">Correct!!!</button>

</body>

</html>

Here is the javascript code:

function getFieldValue(target) {
    var elm = document.getElementById(target);
    var val = parseInt(elm.value);
    return val;
}

function getCompGuess() {
    var upper = getFieldValue("UPPER");
    var lower = getFieldValue("LOWER");
    return (parseInt((upper + lower) / 2))
}


/* User starts game. */
    function play() {
    document.getElementById('CORRECT').removeAttribute("disabled");
    var remaining = getFieldValue("REMAINING");

    var compGuess = getCompGuess();
    var compElm = document.getElementById("COMP_GUESS");

    compElm.innerHTML = compGuess;
    document.compGuess = compGuess;
}

/* "Correct" Button pressed. */
function correct() {
    var r = getFieldValue("REMAINING");
    alert("Computer wins with " + r + " guesses remaining.");
}


/* Higher or lower button */
function high(userChoice) {
    if (userChoice === "GUESS_HIGHER") 
        var low = getFieldValue("LOWER");
        if (document.compGuess > low) {
            document.getElementById("LOWER").value =
            document.compGuess;
        }
        play();
}

        function low(userChoice)  {
        if (userChoice === "GUESS_LOWER") 
        var high = getFieldValue("UPPER");
        if (document.compGuess < high) {
            document.getElementById("UPPER").value = document.compGuess;
        }
        play();
    }
Ad

Answer

This is the answer for your question "So I need to know how to automatically decrease the value (number) in the "Guesses Remaining" input field."

function getFieldValue(target) {
  var elm = document.getElementById(target).value;
  var val = parseInt(elm);
  return val;
}

function getCompGuess() {
    var upper = getFieldValue("UPPER");
    var lower = getFieldValue("LOWER");
    return (parseInt((upper + lower) / 2))
}


/* User starts game. */


    function play() {
      
    var guess_remaining = document.getElementById("REMAINING").value;
    document.getElementById('CORRECT').removeAttribute("disabled");
    var remaining = getFieldValue("REMAINING");
      if(isNaN(remaining)){    //When you first call getFieldValue("REMAINING") it returns NaN, means user just started to play
        var guess_remaining = 5;
          document.getElementById("REMAINING").value = guess_remaining;
        }
      else {
        if(guess_remaining>0) {
          guess_remaining = guess_remaining-1;
    var compGuess = getCompGuess();
    var compElm = document.getElementById("COMP_GUESS");

    compElm.innerHTML = compGuess;
    document.compGuess = compGuess;
          }
          document.getElementById("REMAINING").value = guess_remaining;
        }
}

/* "Correct" Button pressed. */
function correct() {
    var r = getFieldValue("REMAINING");
    alert("Computer wins with " + r + " guesses remaining.");
}


/* Higher or lower button */
function high(userChoice) {
    if (userChoice === "GUESS_HIGHER") 
        var low = getFieldValue("LOWER");
        if (document.compGuess > low) {
            document.getElementById("LOWER").value =
            document.compGuess;
        }
        play();
}

        function low(userChoice)  {
        if (userChoice === "GUESS_LOWER") 
        var high = getFieldValue("UPPER");
        if (document.compGuess < high) {
            document.getElementById("UPPER").value = document.compGuess;
        }
        play();
    }
Guess a number game: <br/> <br/>

Upper Bound: <input id="UPPER"  type="text"></input> <br/>
Lower Bound: <input id="LOWER" type="text"></input> <br/>
Guesses Remaining: <input id="REMAINING" type="text"></input> <br/>

<button onclick="play()">Play!</button>  <br/>

Computer's Guess: <span id="COMP_GUESS"></span> <br/>

<button onclick='high("GUESS_HIGHER")'>Guess Higher</button>
<button onclick="low('GUESS_LOWER')">Guess Lower</button>
<button disabled=true onclick="correct()" id="CORRECT">Correct!!!</button>

Ad
source: stackoverflow.com
← Previous Post
Next Post →

Related Questions

Ad