本文介绍如何利用JavaScript实现表单验证，特别是在用户输入邮箱地址时，通过正则表达式判断邮箱地址的合法性，确保表单提交前的正确性。
pass的代码:
<html>
<head>
<meta charset="utf-8" />
</head>
<body>
<h1>表单验证通过！！！！</h1>
</body>
</html>
form.html的代码:
<html>
<head>
<title>JS程序开发</title>
<meta charset="utf-8" />
<script type="text/javascript" src="form.js">
</script>
</head>
<body>
<form action="pass.html" method="post" id="log">
登陆邮箱:<input type="text" name="email" id="email" />
<!--id与name属性要相同 -->
<br />
<button type="submit" id="sub">登陆</button>
</form>
</body>
</html>
form.js的代码:
window.onload = function(){//如果要表单不提交，则要用的onsubmit事件，如果这个事件返回值为false，则不提交表单
var hxy = document.getElementById("log");
hxy.addEventListener("submit",function(e){
var emailobj = document.getElementById("email");
if(emailobj.value == ""){
alert("您还没有输入登陆邮箱，无法登陆！");
e.preventDefault() ;//动态验证绑定时用这句话阻止浏览器的默认操作
}else{
if(/^\w+@\w+\.\w+$/.test(emailobj.value)){
this.submit();//当前对象提交表单
}else{
alert("您输入的地址不合法，请重新输入");
e.preventDefault() ;
}
}
},false);
}
扫一扫
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
