Why when I am submiting an answer javascript is always displaying false?

Question

I have problem with displaying true/false after submiting an answer to question.

I need to display true when answer is true e.g.( 14+1=15 true), but my code is always displaying false and never displays true. Hope you will understand my code.

p.s. to display question press answer, in start it doesn't display question.

function myfunc() {
    //randomizer + - * /
    var symbol;

    var s = Math.floor(Math.random() * 5);
    if (s === 1) {
        symbol = '+';
    }
    if (s === 2) {
        symbol = '-';
    }
    if (s === 3) {
        symbol = '*';
    }
    if (s === 4) {
        symbol = '/';
    }
    //first num randomizer
    var firstnum = Math.floor(Math.random() * 100);
    //sec num randomizer
    var secnum = Math.floor(Math.random() * 100);
    document.getElementById('demo').innerHTML = firstnum + symbol + secnum;
    //answer filter
    var input = document.getElementById('input').value;
    var testanswer;
    if (s === 1) {
        testanswer = firstnum + secnum;
    }
    if (s === 2) {
        testanswer = firstnum - secnum;
    }
    if (s === 3) {
        testanswer = firstnum * secnum;
    }
    if (s === 4) {
        testanswer = firstnum / secnum;
    }
    //test answerer
    if (testanswer === input) {
        document.getElementById('atbilde').innerHTML = 'true';
    }
    else {
        document.getElementById('atbilde').innerHTML = 'false';
    }
}

<!DOCTYPE html>
<html>
<head>
    <title>test</title>
    <script type="application/javascript" src="test.js"></script>
    </head>
    <body>
    <p id="demo"></p>
        <input id="input" type="text">
        <button id="mybt" type="button" onclick="myfunc()">submit</button><br>
        <p id="atbilde"></p>
    </body>
</html>

`input` will always be a string, where as `testanswer` is a number so `===` will always be false — pilchard, Aug 09 '22 at 20:25
Does this answer your question? [Which equals operator (== vs ===) should be used in JavaScript comparisons?](https://stackoverflow.com/questions/359494/which-equals-operator-vs-should-be-used-in-javascript-comparisons) — pilchard, Aug 09 '22 at 20:27

score 0 · Answer 1 · answered Aug 09 '22 at 20:30

First of all, randomizing * 5 for 4 symbols is incorrect. Also, try to compare the answer to the actual numbers, not to the newly generated one.

var last = null;
myfunc();

function myfunc() {
  //randomizer + - * /
  var symbol;

  var s = Math.floor(Math.random() * 4) + 1;
  if (s === 1) {
    symbol = '+';
  }
  if (s === 2) {
    symbol = '-';
  }
  if (s === 3) {
    symbol = '*';
  }
  if (s === 4) {
    symbol = '/';
  }
  //first num randomizer
  var firstnum = Math.floor(Math.random() * 10);
  //sec num randomizer
  var secnum = Math.floor(Math.random() * 10);
  document.getElementById('demo').innerHTML = firstnum + symbol + secnum;
  //answer filter
  var input = document.getElementById('input').value;

  var testanswer;
  if (s === 1) {
    testanswer = firstnum + secnum;
  }
  if (s === 2) {
    testanswer = firstnum - secnum;
  }
  if (s === 3) {
    testanswer = firstnum * secnum;
  }
  if (s === 4) {
    testanswer = firstnum / secnum;
  }

  if (last != null) {
    if (last == input && input != '') {
      document.getElementById('atbilde').innerHTML = 'true';
    } else {
      document.getElementById('atbilde').innerHTML = 'false';
    }
  }
  last = testanswer;
}

<form onsubmit="myfunc(); return false">
  <p id="demo"></p>
  <input id="input" type="text">
  <button id="mybt" type="submit">submit</button><br>
  <p id="atbilde"></p>
</form>

score 0 · Answer 2 · answered Aug 09 '22 at 20:37

Need to separate generating questions from checking answers. I modified your code and added some comments:

HTML

<p id="demo"></p>
<input id="input" type="text">
<button id="mybt" type="button" onclick="checkAnswer()">submit</button><br>
<button type="button" onclick="showQuestion()">Show New Question</button><br>
<p id="atbilde"></p>

JavaScript:

  var s, firstnum, secnum;

  // first, show an initial question for a start
  showQuestion();

  // this method is used to show initial question and also to "Show New Question" when that button is pressed
  function showQuestion(){
      //randomizer + - * /
      let symbol;

      // changed formula to return 1, 2, 3, or 4. It was also returning 0 and 5 previously.
      s = Math.floor(Math.random() * 4) + 1;
      if (s === 1) {
          symbol = '+';
      }
      if (s === 2) {
          symbol = '-';
      }
      if (s === 3) {
          symbol = '*';
      }
      if (s === 4) {
          symbol = '/';
      }

      //first num randomizer
      firstnum = Math.floor(Math.random() * 100);
      //sec num randomizer
      secnum = Math.floor(Math.random() * 100);
      document.getElementById('demo').innerHTML = firstnum + symbol + secnum;
  }

  // when the user is ready and clicks submit, we check the answer using s, firstnum, and secnum
  function checkAnswer() {
      //answer filter
      var input = document.getElementById('input').value;
      var testanswer;
      if (s === 1) {
          testanswer = firstnum + secnum;
      }
      if (s === 2) {
          testanswer = firstnum - secnum;
      }
      if (s === 3) {
          testanswer = firstnum * secnum;
      }
      if (s === 4) {
          testanswer = firstnum / secnum;
      }

      console.log('the answer is supposed to be ', testanswer, ' and the user submitted ', testanswer);

      //test answer
      // I changed === to == this way you can compare a string "100" to the number 100 and it will be true.
      // Because "100" === 100 is false (it checks the type) and "100" == 100 is true (does not check the type.)
      if (testanswer == input) {
          document.getElementById('atbilde').innerHTML = 'true';
      }
      else {
          document.getElementById('atbilde').innerHTML = 'false';
      }
  }

Why when I am submiting an answer javascript is always displaying false?

2 Answers2