在html里用cookie制作一个有正则表达式的注册界面,要求有账号和密码的验证,如果错误有弹窗提醒,正确的则存入cookie返回主界面
时间: 2024-03-20 11:39:13 浏览: 19
好的,以下是一个简单的用户注册页面的 HTML 代码,使用了 cookie 来保存用户信息,并使用了 JavaScript 正则表达式来验证用户输入:
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>用户注册</title>
</head>
<body>
<h1>用户注册</h1>
<form action="register.php" method="post" onsubmit="return validateForm()">
<label for="username">用户名:</label>
<input type="text" id="username" name="username" required><br>
<label for="password">密码:</label>
<input type="password" id="password" name="password" required><br>
<label for="confirm_password">确认密码:</label>
<input type="password" id="confirm_password" name="confirm_password" required><br>
<input type="submit" value="注册">
</form>
<a href="index.php">返回主页</a>
<script>
function validateForm() {
// 获取表单输入
var username = document.getElementById("username").value;
var password = document.getElementById("password").value;
var confirm_password = document.getElementById("confirm_password").value;
// 验证用户名和密码是否符合要求
var username_regex = /^[a-zA-Z0-9_-]{3,16}$/;
var password_regex = /^[a-zA-Z0-9_-]{6,18}$/;
if(!username_regex.test(username)) {
alert("用户名必须是 3-16 个字符,只能包含字母、数字、下划线和破折号。");
return false;
}
if(!password_regex.test(password)) {
alert("密码必须是 6-18 个字符,只能包含字母、数字、下划线和破折号。");
return false;
}
// 验证两次输入的密码是否一致
if(password != confirm_password) {
alert("两次输入的密码不一致。");
return false;
}
// 保存用户信息到 cookie
document.cookie = "username=" + username;
document.cookie = "password=" + password;
return true;
}
</script>
</body>
</html>
```
以上代码中使用了 JavaScript 正则表达式来验证用户名和密码是否符合要求,如果不符合,则会弹出一个提示框。如果验证通过,则将用户信息保存到 cookie 中,并返回主页。在实际应用中,你需要编写服务器端的代码来处理表单数据,并实现用户注册的功能。