HTML:JavaScript判断从input中获取的数据的类型-优快云博客

本文介绍如何使用JavaScript和正则表达式来验证用户输入的年龄是否为纯数字，并提供了一个简单的示例程序。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

　　在HTML中接收用户输入信息一般都会用到<input/>。我今天本来想实现一个功能：由用户在input中输入自己的年龄，然后根据不同的年龄段弹出不同的信息，为了让程序更加严谨，我得判断从input中获取到的值必须是数字（这个问题其实可以直接限制input的输入内容为数字，在这里我想要实现通过javascript判断input里的值是否是数字）。　　

　　试过很多种方法发现都不行，因为不管用户在input中输入了什么类型的数据，我通过javaScript获取到这个值后都会变成字符，所以我们通常用来判断数据类型的几个方法（Number(a)、typeof、instanceof）在这里都是没有用的，用这几个方法进行判断得到的结果一定是false。

　　试了很多种方法后我发现用正则表达式进行判断很方便，在这里了记录一下：

源代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <script defer>

        function test(num) {
//            判断一串字符是不是全部是数字
            var rex = /^[0-9]+$/;//正则表达式
            var flag = rex.test(num);//通过表达式进行匹配

            if (flag) {
                alert("数据类型合法");
            } else {
                alert("数据类型不合法");
            }

        }

    </script>

</head>
<body>

<input type="text" id="in">
<br>
<button onclick="test(document.getElementById('in').value)">进行数据判断</button>

</body>
</html>

先获取input中的值，再用正则表达式进行判断返回一个布尔值

可以看效果是实现了的：

额外啰嗦一点

如果我们需要将输入框中的字符转换成数字运算也可以使用正则去实现，只要在原来的代码中加上下面红色背景那段代码就可以将字符转换成数字了

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <script defer>

        function test(num) {
//            判断一串字符是不是全部是数字
            var rex = /^[0-9]+$/;//正则表达式
            var flag = rex.test(num);//通过表达式进r行匹配
            var fin = num.match(rex);
            if (flag) {
                alert(fin+"：数据类型合法");
            } else {
                alert("数据类型不合法");
            }

        }

    </script>

</head>
<body>

<input type="text" id="in">
<br>
<button onclick="test(document.getElementById('in').value)">进行数据判断</button>

</body>
</html>

转载于:https://www.cnblogs.com/lyd447113735/p/8999924.html