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

来自:互联网
时间:2023-09-06
阅读:

如何使用 <a href=https://www.freexyz.cn/dev/JavaScript/ target=_blank class=infotextkey>JavaScript</a> 在给定数字在范围内时显示消息?

在本文中,我们将检查数字是否在某个范围内,并根据得到的输出显示一条消息。 JavaScript 的此功能允许您在创建表单或任何其他文档时进行数字验证。

语法

以下是检查数字是否在范围内并显示消息的语法-

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";
}

这里number是输入的数字,用于检查是否在范围内。 lower和upper是范围的下限和上限。

算法

  • 步骤1 − 使用prompt()方法输入数字。

  • 第2步 − 检查三个条件,第一个条件是否为NaN,第二个条件是否为NaN如果数字小于范围的下限,则第三次,如果数字大于范围的上限。

  • 步骤 3 -如果上述三个条件中的任何一个为真,则显示一条消息,表明该号码不在范围内,否则显示一条消息,表明该号码在范围内。

示例

在下面的示例中,我们检查输入的数字是否在 1 到 10 范围内,并显示消息。

<!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('Please enter a number:');
         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>

如输出窗口所示,点击“click me”按钮后,窗口会要求您输入一个数字。

在提示框中输入数字后,您将知道是否是否在给定的范围内。

尝试输入不同的数字来检查数字是否在 1 到 10 的范围内。如示例所示,如果我们输入 1 到 10 之间的任何数字,则输出为 true。上面的示例检查 3 个条件,第一,数字不为空值,第二,它不小于 1,第三,它大于 10。

示例

我们还可以如下所示编写上面的代码,它也会给出相同的输出

<!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('Please enter a number:');
         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>

注意- 我们可以使用此功能在表单上进行验证,例如如果我们想要从给定数据中选择出生日期或在给定选择任何整数的选项时进行验证从0到9回答。

返回顶部
顶部