zoukankan      html  css  js  c++  java
  • JavaScript -- 正则表达式 检验表单提交的内容

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>无标题文档</title>
    
    <script type="text/javascript">
    
    var checkUsernameflag;
    function checkUsername(inputNode)
    {
    	var name = inputNode.value;
    	var namereg = new RegExp("^[a-z]{5}$", "i");  //5个字母, i 可选,忽略大小写
    	var returnCode = name.match(namereg);
    	var spanNode1 = document.getElementById("useryes");
    	var spanNode2 = document.getElementById("userno");
    	if(returnCode!=null)	
    	{
    		spanNode1.style.display = "inline";
    		spanNode1.style.color = "green";
    		spanNode2.style.display = "none";
    		checkUsernameflag = true;				
    	}
    	else
    	{
    		spanNode2.style.display = "inline";
    		spanNode2.style.color = "red";
    		spanNode1.style.display = "none";
    		checkUsernameflag = false;
    	}	
    }
    
    var checkPwdflag;
    function checkPwd(pwdNode)
    {
    	var pwd = pwdNode.value;
    	var pwdreg = new RegExp("^[0-9]{5}$");  //5个数字
    	var returnCode = pwd.match(pwdreg);
    	var spanNode = document.getElementById("pwdspan");
    	if(returnCode!=null)
    	{	
    		spanNode.innerHTML = "密码正确".fontcolor("green");	
    		checkPwdflag = true;
    	}
    	else		
    	{
    		spanNode.innerHTML = "密码格式对".fontcolor("red");	
    		checkPwdflag = false;
    	}
    }
    
    var RecheckPwdflag;
    function RecheckPwd(pwdNode)
    {
    	var pwd2 = pwdNode.value;
    	var pwd1 = document.getElementsByName("passwd1")[0].value;
    	var spanNode = document.getElementById("repwdspan");
    	if(pwd2!="" && pwd1!="" && pwd1==pwd2)	
    	{
    		spanNode.innerHTML = "密码确认正确".fontcolor("green");	
    		RecheckPwdflag = true;
    	}
    	else		
    	{
    		spanNode.innerHTML = "密码与上次不符".fontcolor("red");	
    		RecheckPwdflag = false;
    	}
    }
    
    var checkMailflag;
    function checkMail(mailNode)
    {
    	var mail = mailNode.value;
    	var mailreg = new RegExp("^\w+@\w+(\.\w+)+$");  //邮件正则表达式
    	var returnCode = mail.match(mailreg);
    	var spanNode = document.getElementById("mailspan");
    	if(returnCode!=null)
    	{	
    		spanNode.innerHTML = "邮件格式正确".fontcolor("green");	
    		checkMailflag = true;
    	}
    	else		
    	{
    		spanNode.innerHTML = "邮件格式不正确".fontcolor("red");	
    		checkMailflag = false;
    	}
    }
    
    function checkSubmit()
    {
    	if(checkUsernameflag==true && checkPwdflag==true && RecheckPwdflag==true && checkMailflag==true)	
    		return true;
    	else
    		return false;
    	
    	
    }
    
    </script>
    
    </head>
    
    <body>
    
    <form action="http://www.baidu.com" method="get" onsubmit="return checkSubmit()">
    用户名:<input type="text" name="user" onblur="checkUsername(this)" /> 
    <span id="useryes" style="display:none">用户名正确</span> <span id="userno" style="display:none">用户名错误</span>
    <br/> 
    密码:	<input type="password" name="passwd1"  onblur="checkPwd(this)"/>  <span id="pwdspan"></span>
    <br/>
    确认密码:<input type="password" name="passwd2" onblur="RecheckPwd(this)"/>  <span id="repwdspan"></span>
    <br/>
    邮件地址:<input type="text" name="mail"  onblur="checkMail(this)"/> <span id="mailspan"></span>
    <br/>
    提交: <input type="submit" name="submit" value="提交" />
    </form>
    
    </body>
    </html>
    


     

  • 相关阅读:
    每周总结15
    第二阶段Day02
    第二阶段Day01
    假期学习记录03(高德地图错误码为7:key鉴权错误)
    假期学习记录02(高德地图关于开发版和调试版sha值)
    假期学习记录01(地图显示和基本的配置)
    android获取当前步数
    android实现轮播图(从互联网上寻找图片)
    android中gps的应用
    互联网营销精准决策项目总结
  • 原文地址:https://www.cnblogs.com/xj626852095/p/3648051.html
Copyright © 2011-2022 走看看