[Solved] Showing messages when a JS variable reaches a certain number?

Firstly, apologies for the basic question.

I’m making a tally counter essentially, however I’m making it for a game. I’d like to know if I can do this. I would like the message to show when the number is 0, and then change when the number hits 1, 15, 30 etc.

How can I do this?

Here is the project code:

Here is the number line:

<p style="font-size:30px;">Chain no: <a id="clicks">0</a></p>

And here is the js for the number:

Thank you in advance!

Maybe something like this…

1 Like

That’s perfect - thank you so much!

Made a small tweak to displayMessage to avoid manipulating the DOM when we don’t need to.

function displayMessage(msg) {
  var messageBox = document.querySelector('#messageBox')
  if(messageBox.innerText !== msg) { // only update if needed!
    messageBox.innerText = msg
  }  
}
1 Like

Is there any way I can make it so that it shows the same message from one number to another?

For example, when the value is 1 - 5 show No guarantee?

Thank you!

Sure. You can add that logic to the getMessageFor function. In the spirit of learning … give it a try on your own first and let me know how it goes.

1 Like

Okay, thank you very much!

1 Like

I attempted to do this (counterValue === 0, 1, 2, 3), however it just leaves the text there, and does not change unless I go the other way.

Here is the pen:

Thanks! :smile:

Unfortunately, in JavaScript, you can’t provide a list of values like that.

You need to take advantage of conditional, and logical operators.

Here’s a link with a list of those operators and some examples:

https://www.w3schools.com/js/js_comparisons.asp

1 Like

Thank you once again!

1 Like

Okay, I’m trying to make a variable and use that to show the messages up.

I made a var called low, and tried to make it an array: var low = [1, 2, 3, 4];. Didn’t work :frowning:

In the link I gave you, look at the greater than or equal to operators and the less than or equal to operator and then take a look at the AND operator.

1 Like

Okay, thank you! Sorry for all the questions…

1 Like

Okay … I may be away for a while … here’s the solution, try not to look until you’ve got it yourself:

if (counterValue === max || counterValue === min) {
    return "LIMIT reached!"
  } else if (counterValue > winningNumber) {
    return "You only need " + winningNumber + " to win."
  } else if (counterValue === winningNumber) {
    return "Winner, winner, chicken dinner!"
  } else if (counterValue === 0) {
    return "Nothing comes from nothing"
  } else if (counterValue >= 1 && counterValue <= 5) { // if between 1 and 5 inclusive
    return "No guarntee." // this will do what you want. 
  } else {
    return "keep going!"
  }
1 Like

Thanks! I ended up doing it individually, it does have the advantage of being able to edit each one.

Thanks so much for the awesome help! :slight_smile: