How to use JavaScript to display a message when a given number is within a range?-JS Tutorial-php.cn

How to use JavaScript to display a message when a given number is within a range?

WBOY

Release： 2023-09-06 23:09:08

forward

970 people have browsed it

如何使用 JavaScript 在给定数字在范围内时显示消息？

In this article, we will check if a number is within a certain range and display a message based on the resulting output. This feature of JavaScript allows you to perform numerical validation while creating a form or any other document.

Syntax

The following is the syntax to check if the number is within the range and display the message -

if (isNaN(number) || number < lower || number > upper){
   document.getElementById("output").innerHTML = number + " is not in range";
} else {
   document.getElementById("output").innerHTML = number + " is in range";
}

Copy after login

Here number is the number entered for checking Is it within range. lower and upper are the lower and upper limits of the range.

Algorithm

Step 1 − Use prompt() method to input numbers.
Step 2 − Check three conditions, whether the first condition is NaN, and whether the second condition is NaN. If the number is less than the lower limit of the range, then The third time, if the number is greater than the upper limit of the range.
Step 3 - If any of the above three conditions is true, then display a message stating that the number is not in range, else display a message, Indicates that the number is within range.

Example< /h2>

In the following example, we check if the entered number is in the range of 1 to 10 and display the message.

<!DOCTYPE html>
<html>
<body>
   <div>
   <h3>Display Message if number is in Range</h3>
   <p>Click the below button to enter number.</p>
   <button onclick="display()"> click me</button>
   <p id="output"></p>
   </div>
   <script>
      function display() {
         const number = prompt(&#39;Please enter a number:&#39;);
         if (isNaN(number) || number < 1 || number > 10)
            document.getElementById("output").innerHTML = number + " is not in range";
         else
            document.getElementById("output").innerHTML = number + " is in range";
      }
   </script>
</body>
</html>

Copy after login

As shown in the output window, after clicking the "click me" button, the window will ask you to enter a number.

After entering the number in the prompt box, you will know if it is within the given range.

Try entering different numbers to check if the number is in the range of 1 to 10. As shown in the example, if we enter any number between 1 and 10, the output is true. The above example checks 3 conditions, first, the number is not null, second, it is not less than 1, and third, it is greater than 10.

Example

We can also write the above code as shown below and it will also give the same output

<!DOCTYPE html>
<html>
<body>
   <div>
   <h3>Display Message if number is in Range</h3>
   <p>Click the below button to enter number.</p>
   <button onclick="display()"> click me
   </button>
   <p id="message"></p>
   </div>
   <script>
      function display() {
         const number = prompt(&#39;Please enter a number:&#39;);
         if (number >= 1 && number <= 10)
            document.getElementById("message").innerHTML = number + " is in range";
         else
            document.getElementById("message").innerHTML = number + " is not in range";
      }
   </script>
</body>
</html>

Copy after login

Note- We can use This function does validation on the form like if we want to select date of birth from given data or validate when given option to select any integer answer from 0 to 9.

The above is the detailed content of How to use JavaScript to display a message when a given number is within a range?. For more information, please follow other related articles on the PHP Chinese website!