JavaWeb之JavaScript表单验证(正则表达式)

最新推荐文章于 2025-03-15 19:50:29 发布

原创最新推荐文章于 2025-03-15 19:50:29 发布 · 791 阅读

8 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#javascript #java #html #css #js

收录于

JavaWeb 专栏收录该内容

19 篇文章

订阅专栏

本文介绍如何在JavaWeb中使用JavaScript进行表单验证，通过正则表达式确保数据输入的有效性。通过创建动态Web项目并新建HTML页面，展示了JavaScript验证的基本步骤和效果。

正则表达式如何运用呢,常用场景当然是表单验证啦,废话不多说,直接进入正题

先创建一个Dynamic Web Project(动态Web项目),然后新建一个html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <form action="#" method="post" id="frmInfo">
        <div id="err" style="color: red">

        </div>
        <div>
            姓名:<input id="name" name="name"/>

        </div>
        <div>
            <input type="submit"/>
        </div>
    </form>

    <script type="text/javascript">
        document.getElementById("frmInfo").onsubmit = function (){
            //在JS中定义正则表达式对象: /正则表达式/
            var regex1 = /^[\u4e00-\u9fa5]{2,8}$/;
            var name = document.getElementById("name").value;
            //利用正则校验数据,true代表匹配成功,反之失败
            if(regex1.test(name) == false){
                document.getElementById("err").innerHTML = "无效姓名";
                return false;
            }else{
                alert("验证通过,准备提交");
                return true;
            }
        }
    </script>
</body>
</html>