JS正则表达式验证邮箱登入+分析

最新推荐文章于 2021-10-28 23:06:30 发布

我不是浩学生

最新推荐文章于 2021-10-28 23:06:30 发布

阅读量427

点赞数 1

分类专栏： JS

本文链接：https://blog.csdn.net/javaKingofFuture/article/details/105615014

版权

JS 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

js正则表达式验证邮箱登入

	<style type="text/css">
		#emailError {
			color: red;
		}
	</style>

	<script type="text/javascript">
		window.onload = function() {
			/* 分析：
					0.给提交按钮绑定事件
					1.先获取 用户输入框 的值
					2.写正则表达式
					3.用正则表达式的 test函数 来判断合不合法，并显示
	
				改进：
					1.文本框一获取焦点，就去掉后边的提示 内容 
					*/
			document.getElementById("btn").onclick = function() {
				var email = document.getElementById("email").value
				var emailRegExp = /^([a-zA-Z]|[0-9])(\w|\-)+@[a-zA-Z0-9]+\.([a-zA-Z]{2,4})$/;
				var ok = emailRegExp.test(email)
				if (ok) {
					document.getElementById("emailError").innerText = "邮箱格式合法";
				} else {
					document.getElementById("emailError").innerText = "邮箱格式不合法";
				}
			}
			//给文本框绑定focus
			document.getElementById("email").onfocus=function(){
				document.getElementById("emailError").innerText = "";
			}
		}
	</script>
</head>
<body>
	<input type="text" id="email" value="" />
	<span id="emailError"></span>
	<br>
	<input type="button" name="" id="btn" value="提交" />
</body>

我不是浩学生

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
JS正则表达式验证邮箱登入+分析

js正则表达式验证邮箱登入 <style type="text/css"> #emailError { color: red; } </style> <script type="text/javascript"> window.onload = function() { /* 分析： 0.给提交按钮...
复制链接

扫一扫