表单验证
<!-- IE上面,对象不支持checkValidity()
checkValidity() 如果 input 元素中的数据是合法的返回 true，否则返回 false。
setCustomValidity() 设置 input 元素的 validationMessage 属性，用于自定义错误提示信息的方法。-->
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>javaScript学习</title>
<link rel="stylesheet" type="text/css" href="css/javascriptstyle.css"/>
<script>
function yanz(){
var x = document.forms["myForm"]["fname"].value;
var e = document.forms["myForm"]["email"].value;
var s = document.getElementById("fname");
var atops = e.indexOf("@");
var dian = e.lastIndexOf(".");
if(x==null || x==""){
s.innerHTML = "需要输入名字";
// alert("需要输入名字。");
return false;
}else{
s.innerHTML = "";
}
//email格式验证
if(atops<1 || dian<atops+2 || dian+2>=e.length){
alert("这不是一个有效的e-mail地址");
return false;
}
}
</script>
</head>
<body>
<form name="myForm" action="javaScript.html" onsubmit="return yanz();" method="post">
姓名：<input type="text" id="" name="fname"/><span id="fname"></span><br />
Email:<input type="text" name="email" id="email" value="" required/><span for="email"></span>
<input type="submit" value="提交"/>
</form>
<p>点击按钮，提交表单，如果输入框是空的，浏览器会提示错误信息。</p>
</body>
</html>
