`
luoweifu
  • 浏览: 61126 次
  • 性别: Icon_minigender_1
  • 来自: 北京
文章分类
社区版块
存档分类
最新评论

JavaScript正则表达式与注册验证

阅读更多


正则表达式是对字符串操作的一种逻辑公式,就是用事先定义好的一些特定字符、及这些特定字符的组合,组成一个规则字符串,这个规则字符串用来表达对字符串的一种过滤逻辑。正则表达式的用处非常广泛,下面讲解一下JavaScript下的正则表达式:

正则表达式语法:

语法1

re=/pattern/[flags]

语法2

re=newRegExp("pattern",["flags"])

参数

re

必选项。将要赋值为正则表达式模式的变量名。

Pattern

必选项。要使用的正则表达式模式。如果使用语法1,用"/"字符分隔模式。如果用语法2,用引号将模式引起来。

flags

可选项。如果使用语法2要用引号将flag引起来。标志可以组合使用,可用的有:

·g(全文查找出现的所有pattern),比如你有一几百行的字符串要搜索,那么你要加g标识(js默认搜索范围为一行搜索)

·i(忽略大小写)

·m(多行查找),js默认查找到第一个符合的字符串就完成任

例:

Regexp.js

function match() {
   str1 = "this is JAVA java Java , this is a first RegExp programe!";
    //str2 = "java";
    re = /java/i;
    re2 = /java/g;
    re3 = new RegExp("java", "i");
    r = str1.match(re);
    r2 = str1.match(re2);
    r3 = str1.match(re3);
    document.writeln(r);
    document.writeln(r2);
     document.writeln(r3);
}

Test.html

<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    </head>
    <body>       
       <script language="javascript" src="regexp.js"></script> 
        <script>
            match();
        </script>
    </body>
</html>

注册验证

register.js
function checkUserName() {
        var username = document.getElementsByName("userName")[0].value;				
        //re = new RegExp("\s*","g");
        //re = /(\s*)/g
        //var isEmpty = re.test(usrname);
        var nameWarning = "";
        if (!(new RegExp("\\S+")).test(username)) { //判断用户名是否为空	
                //alert("请输入用户名!");
                nameWarning = "请输入用户名!";
                document.getElementById("namechick").innerText = nameWarning;
                return false;
        }
        document.getElementById("namechick").innerText = nameWarning;
        return true;
}
function checkPassword() {			
        var pwdWarning = "";
        var password = document.getElementsByName("password")[0].value;						
        if (password != ""
                        && !(new RegExp("^(\\s*)$")).test(password)) {//密码不为空
                if(!/\w{6}/.test(password)) {       //密码不是6位的字符或数字
                    pwdWarning = "密码为6位的字符或数字";
                }                                       

        } else {        //密码为空
            pwdWarning = "请输入密码!";
                document.getElementById("pwdchick").innerText = pwdWarning;
                return false;
        }
        document.getElementById("pwdchick").innerText = pwdWarning;
        return true;
}
function checkEmail() {
     var emailWarning = "";
        var email = document.getElementsByName("email")[0].value;						
        if (!(new RegExp("[\\w[._]]+@[\\w[._]]+\\.[\\w]+")).test(email)) {       //密码不是6位的字符或数字
           emailWarning = "邮箱格式不正确!";
           //return false;
        }
    document.getElementById("emailchick").innerText = emailWarning;
    return true;
}
register.html
<html>
	<head>
		<title>注册</title>
<style type="text/css">

.STYLE1 {color: #FF0000}

</style>		
<script language="JavaScript" src="register.js">			
		</script>
		<!--<link rel="stylesheet" type="text/css" href="./styles.css">

	-->
	</head>

	<body>
		<h2 align="center">
			<strong>注册:</strong>
		</h2>
		<br>
		<form action="success.html" method="post"
			onsubmit="return checkForm(this);">
			<table width="400" border="0" align="center">
				<tbody>
					<tr>
						<td>
							用户名:
						</td>
						<td>
							<input type="text" name="userName" onblur ="return checkUserName();">
						</td>
						<td id="namechick" class="STYLE1"></td>
					</tr>
					<tr>
						<td>
							密码:
						</td>
						<td>
							<input type="password" name="password" onblur ="return checkPassword();">
						</td>
						<td id="pwdchick" class="STYLE1"></td>
					</tr>
                                        <tr>
						<td>
							邮 箱:
						</td>
						<td>
							<input type="text" name="email" onblur ="return checkEmail();">
						</td>
						<td id="emailchick" class="STYLE1"></td>
					</tr>
					<tr>
                                            <td align="center" colspan="3">
							<input type="submit" name="login" value="注  册">
						</td>						
					</tr>
                                        
				</tbody>
			</table>
			<br>
		</form>
	</body>
</html>

success.html
<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    </head>
    <body>
        <h1 align="center">注册成功!</h1>
    </body>
</html>


分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics