DHTML技术---正则表达式和onblur方法学习

最新推荐文章于 2023-06-03 22:40:52 发布

原创最新推荐文章于 2023-06-03 22:40:52 发布 · 593 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #正则表达式 #技术 #dhtml #前端

J2EE 专栏收录该内容

69 篇文章

订阅专栏

本文介绍了JavaScript中正则表达式的两种定义方式及其应用，并通过示例代码展示了如何使用正则表达式进行字符串验证。此外，还介绍了如何利用onblur事件实现用户交互。

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

在网页中，我们常常需要做一些验证用户输入的信息是否合格，我们不可能所有的验证都放到后台，那么前端也需要验证，这就要用到我们JavaScript中的正则表达式。
在JavaScript中，正则表达式有两种定义方式

方式一：格式 re = /pattern/[flags]
方式二：格式 re = new RegExp(“pattern”,[“flags”]) - re:必选项，将要赋值为正则表达式模式的变量名。
- Pattern：必选项，要使用的正则表达式模式。如果使用语法 1，用 “/” 字符分隔模式。如果用语法 2，用引号将模式引起来。
- flags：可选项。如果使用语法 2 要用引号将 flag 引起来。标志可以组合使用，可用的有：

g （全文查找出现的所有 pattern）
i （忽略大小写）
m （多行查找）
代码演示：

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>正则表达式、onblur方法学习</title>
        </head>
    <body>  
        <h2>正则表达式学习</h2>
        <script type="text/javascript">
            function demo1(){
                //在JavaScript中，正则表达式有两种定义方式
                //方式一：格式 re = /pattern/[flags]
                //方式二：格式 re = new RegExp("pattern",["flags"]) 
                /*
                    re:必选项，将要赋值为正则表达式模式的变量名。
                    Pattern：必选项，要使用的正则表达式模式。如果使用语法 1，用 "/" 字符分隔模式。如果用语法 2，用引号将模式引起来。
                    flags：可选项。如果使用语法 2 要用引号将 flag 引起来。标志可以组合使用，可用的有：
                        g （全文查找出现的所有 pattern）
                        i （忽略大小写）
                        m （多行查找）
                */
                var reg1 = /[a-z]{4}/i;// 寻找是否含有连续4个字母（忽略大小写），
                var reg2 = new RegExp("[a-z]{4}","i");// 寻找是否含有连续4个字母（忽略大小写），

                //使用：调用reg.text(str)方法---true/false
                var str1 = "1234abcd";
                var str2 = "1234abc";  
                document.write("第一种方式验证"+str1+"的结果是"+reg1.test(str1));
                document.write("<br/>第一种方式验证"+str2+"的结果是"+reg1.test(str2));
                document.write("<br/>第一种方式验证"+str1+"的结果是"+reg2.test(str1));
                document.write("<br/>第二种方式验证"+str2+"的结果是"+reg2.test(str2));
            }
            demo1();
        </script>

        <h2>onblur学习</h2>
        <input type="text" onblur="demo2()"><span id="sid"></span>
        <script type="text/javascript">
            function demo2(){
                var s=document.getElementById("sid");
                s.innerHTML="触发了onblur方法";
            }
        </script>

    </body>
</html>

演示结果
这里写图片描述