hbuilder登录注册页面代码
时间: 2023-08-16 08:10:12 浏览: 58
以下是一个简单的 HBuilder 登录注册页面代码示例:
HTML 代码:
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Login/Register</title>
</head>
<body>
<h1>Login/Register</h1>
<div id="login">
<h2>Login</h2>
<form>
<label for="username">Username:</label>
<input type="text" id="username" name="username"><br><br>
<label for="password">Password:</label>
<input type="password" id="password" name="password"><br><br>
<input type="submit" value="Submit">
</form>
</div>
<div id="register">
<h2>Register</h2>
<form>
<label for="username">Username:</label>
<input type="text" id="username" name="username"><br><br>
<label for="email">Email:</label>
<input type="email" id="email" name="email"><br><br>
<label for="password">Password:</label>
<input type="password" id="password" name="password"><br><br>
<input type="submit" value="Submit">
</form>
</div>
<script src="js/login-register.js"></script>
</body>
</html>
```
JavaScript 代码:
```javascript
var loginForm = document.querySelector("#login form");
var registerForm = document.querySelector("#register form");
loginForm.addEventListener("submit", function(e) {
// 阻止表单提交的默认行为
e.preventDefault();
// 获取用户名和密码
var username = document.querySelector("#login #username").value;
var password = document.querySelector("#login #password").value;
// TODO: 处理登录逻辑
});
registerForm.addEventListener("submit", function(e) {
// 阻止表单提交的默认行为
e.preventDefault();
// 获取用户名、邮箱和密码
var username = document.querySelector("#register #username").value;
var email = document.querySelector("#register #email").value;
var password = document.querySelector("#register #password").value;
// TODO: 处理注册逻辑
});
```
注意:这只是一个简单的示例,实际开发中需要更完善的表单验证和后端逻辑处理。