JavaScript总结

最新推荐文章于 2023-01-16 10:13:30 发布

原创最新推荐文章于 2023-01-16 10:13:30 发布 · 置顶 · 484 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #邮箱 #验证

WEB 专栏收录该内容

17 篇文章

订阅专栏

1邮箱验证:

HTML中的form在提交之前验证数值文本框中的内容为合法的邮箱地址，否则的话提示用户并终止提交！

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<title>helloworldl.html</title>
		<!-- js判断输入的是否为邮箱格式 -->
		<script type="text/javascript">
		 //这样子写的目的是为了能够在加载完整个html页面的时候能够进行验证
	      function varifyEmailInform(email){
		   //正则匹配邮箱：shsssssss@126.com
           // \w 单词字符：[a-zA-Z_0-9] ; X+: X出现一次或多次 
		   var dataPattern=/^\w+@\w+.\w+$/;
		   return dataPattern.test(email);
		}
		
		function valify(myform){
		   var emailstr=myform.email.value; //获取当前表格中data属性的值
          	   if(emailstr==""){
          	      alert("您输入的email不能为空");
          	      return false;
          	   }else{
          	       if(!varifyEmailInform(emailstr)){
          	       alert("您输入的格式不正确");
          	       this.email.value="";
          	       return false;   
          	      }else{
          	          alert("验证成功！！");
          	          return true;
          	      }
          	   }
          	}

    </script>
	</head>
	<body>
		<form action="" method="post" id="myform" onsubmit="return valify(this)">
			请输入日期
			<input type="text" name="email" />
			<input type="submit" value="验证" />
		</form>

	</body>
</html>

2：邮箱验证

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<title>helloworldl.html</title>
		<!-- js判断输入的是否为邮箱格式 -->
		<script type="text/javascript">
		 //这样子写的目的是为了能够在加载完整个html页面的时候能够进行验证
		 
		 window.onblur=function(){
		  document.getElementById("myform").onsubmit=
		  function(){
		  var emailstr=this.email.value; //获取当前表格中data属性的值
          	   if(emailstr==""){
          	      alert("您输入的email不能为空");
          	      return false;
          	   }else{
          	       if(!varifyEmailInform(emailstr)){
          	       alert("您输入的格式不正确");
          	       this.email.value="";
          	       return false;   
          	      }else{
          	          alert("验证成功！！");
          	          return true;
          	      }
          	   }	  
		  }
		 }
	      function varifyEmailInform(email){
		   //正则匹配邮箱：shsssssss@126.com
           // \w 单词字符：[a-zA-Z_0-9] ; X+: X出现一次或多次 
		   var dataPattern=/^\w+@\w+.\w+$/;
		   return dataPattern.test(email);
		}		
    </script>
	</head>
	<body>
		<form action="" method="post" id="myform">
			请输入日期
			<input type="text" name="email" />
			<input type="submit" value="验证" />
		</form>

	</body>
</html>

3: 检验HTML文本框中输入的邮箱是否合法，当失去焦点的时候进行验证，注意：验证与否与提交无关，文本框的失去焦点以及获得焦点有关。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<title>helloworldl.html</title>
		<!-- js判断输入的是否为邮箱格式 -->
		<script type="text/javascript">
		 //这样子写的目的是为了能够在加载完整个html页面的时候能够进行验证
	      function varifyEmailInform(email){
		   //正则匹配邮箱：shsssssss@126.com
           // \w 单词字符：[a-zA-Z_0-9] ; X+: X出现一次或多次 
		   var dataPattern=/^\w+@\w+.\w+$/;
		   return dataPattern.test(email);
		}
		
		function valify(email){
		   var emailstr=email.value; //获取当前表格中data属性的值
          	   if(emailstr==""){
          	      alert("您输入的email不能为空");
          	      return false;
          	   }else{
          	       if(!varifyEmailInform(emailstr)){
          	       alert("您输入的格式不正确");
          	       this.email.value="";
          	       return false;   
          	      }else{
          	          alert("验证成功！！");
          	          return true;
          	      }
          	   }
          	}

    </script>
	</head>
	<body>
		<form action="" method="post" id="myform">
			请输入日期
			<input type="text" name="email"  onblur="valify(this)"/>
			<input type="submit" value="验证" />
		</form>

	</body>
</html>