HTML简单的注册表单验证
warning:
这篇文章距离上次修改已过279天,其中的内容可能已经有所变动。
<!DOCTYPE html>
<html>
<head>
<title>简单注册表单验证</title>
<script>
function validateForm() {
var x = document.forms["myForm"]["fname"].value;
if (x == "") {
alert("名字必须填写");
return false;
}
var email = document.forms["myForm"]["email"].value;
var emailPat = /^(.+?)@(.+?)$/;
if (!emailPat.test(email)) {
alert("无效的邮箱格式");
return false;
}
var pwd1 = document.forms["myForm"]["pwd1"].value;
var pwd2 = document.forms["myForm"]["pwd2"].value;
if (pwd1 != pwd2) {
alert("密码不匹配");
return false;
}
}
</script>
</head>
<body>
<form name="myForm" action="register_backend.php" onsubmit="return validateForm()" method="post">
名字: <input type="text" name="fname">
<br>
电邮: <input type="text" name="email">
<br>
密码: <input type="password" name="pwd1">
<br>
确认密码: <input type="password" name="pwd2">
<br>
<input type="submit" value="提交">
</form>
</body>
</html>
这段代码在客户端对用户输入的数据进行简单的验证,如果输入不符合要求,则会弹出警告,并阻止表单的提交。这是一种常见的前端验证方式,可以提高用户体验,但不能确保安全性,后端验证是必须的以防止恶意用户绕过前端验证。
评论已关闭