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

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>