您的位置：首页 > Web前端 > JavaScript

JavaScript表单验证

2016-01-11 13:51 711 查看

JavaScript表单验证整理：
1：必填项目

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<script>
//验证文本框是否为空，为空，则不能提交

function validateForm(){
var x=document.forms["myForm"]["fn"].value;
if(x==null || x==""){
alert("姓名必须填写");
return false;
}

}
</script>
</head>

<body>
<!--form 表单验证，name属性-->
<form name="myForm" action="js01.html" onsubmit="return validateForm()" method="post">
姓名: <input type="text" name="fn">
<input type="submit" value="提交">
</form>
</body>
</html>

2：邮箱验证

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<script>
function myFunction(){
var x=document.forms["myForm"]["email"].value;
var atpos= x.indexOf("@");
var dotpos= x.lastIndexOf(".");
if(atpos<1 || dotpos<atpos+2 || dotpos+2>= x.length){
alert("Not a vaild e-mail address");
return false;
}
}
</script>
</head>
<body>
<!--return的作用是阻止跳转至下一个页面-->
<form name="myForm" action="js02.html" onsubmit="return myFunction()" method="post">
邮箱：<input type="text" name="email">
<input type="submit" value="Submit">
</form>
</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航