您的位置:首页 > 其它

超实用表单验证方法!拿去不谢

2017-10-29 23:27 176 查看
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表单验证</title>
</head>
<body>
<form action="ccy.php" id="form">
账号<input type="text" name="name">
<br>
密码<input type="password" name="pwd">
<br>
<input type="reset" name="reset">
<input type="submit" name="登录">
</form>
</body>
<script>
var form = document.getElementsByTagName("form")[0];

form.onsubmit = function () {
var name = document.getElementsByName("name")[0].value;
var pwd = document.getElementsByName("pwd")[0].value;
//        alert("数据被提交");
if (name == ""||pwd.length<6){
if (name ==""){
alert("账号不能为空")
}else if (pwd.length<6){
alert("密码太短")
}
/*通过return  false 来禁用表达的提交*/
return  false;
}
}

/*如果账号或者密码达到要求,禁止重置*/
form.onreset = function () {
var name = document.getElementsByName("name")[0].value;
var pwd = document.getElementsByName("pwd")[0].value;
if (name!=""&&pwd.length>=6){
return false;
}
}
</script>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: