首页 > web前端 > js教程 > 正文

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

WBOY
发布: 2023-09-06 23:09:08
转载
1077人浏览过

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

在本文中,我们将检查数字是否在某个范围内,并根据得到的输出显示一条消息。 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()方法输入数字。

    立即学习Java免费学习笔记(深入)”;

  • 第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回答。

以上就是如何使用 JavaScript 在给定数字在范围内时显示消息?的详细内容,更多请关注php中文网其它相关文章!

java速学教程(入门到精通)
java速学教程(入门到精通)

java怎么学习?java怎么入门?java在哪学?java怎么学才快?不用担心,这里为大家提供了java速学教程(入门到精通),有需要的小伙伴保存下载就能学习啦!

下载
相关标签:
来源:tutorialspoint网
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
开源免费商场系统广告
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号