这是一个基本的登录注册页面的HTML和JavaScript代码示例,其中包含了检查用户输入的用户名和密码不能为空的功能。请注意,这只是一个前端验证,后端服务器也应该进行相应的验证以确保数据的安全性。

HTML部分:
<!DOCTYPE html>
<html>
<head>
<title>登录注册页面</title>
<script src="https://www.2718281.com/static/image/lazy.gif" class="lazy" original="https://www.2718281.com/static/image/nopic320.png" <div id="loginForm">
<h2>登录</h2>
<form id="loginFormInput">
<input type="text" id="loginUsername" placeholder="用户名" required>
<input type="password" id="loginPassword" placeholder="密码" required>
<button type="submit">登录</button>
</form>
</div>
<div id="registerForm">
<h2>注册</h2>
<form id="registerFormInput">
<input type="text" id="registerUsername" placeholder="用户名" required>
<input type="password" id="registerPassword" placeholder="密码" required>
<button type="submit">注册</button>
</form>
</div>
</body>
</html>JavaScript部分(script.js):
document.getElementById(’loginFormInput’).addEventListener(’submit’, function(event) {
var username = document.getElementById(’loginUsername’).value;
var password = document.getElementById(’loginPassword’).value;
if(username == "" || password == "") {
alert("用户名和密码不能为空");
event.preventDefault(); //阻止表单提交,直到用户填写正确的信息
} else {
// 执行登录操作,例如发送请求到服务器进行验证等,这里没有展示这部分代码。
}
});
document.getElementById(’registerFormInput’).addEventListener(’submit’, function(event) {
var username = document.getElementById(’registerUsername’).value;
var password = document.getElementById(’registerPassword’).value;
if(username == "" || password == "") {
alert("用户名和密码不能为空");
event.preventDefault(); //阻止表单提交,直到用户填写正确的信息
} else {
// 执行注册操作,例如发送请求到服务器进行新用户注册等,这里没有展示这部分代码。
}
});代码在用户尝试提交登录或注册表单时,会检查用户名和密码输入框是否为空,如果为空,会弹出一个警告提示用户填写正确的信息,并阻止表单的提交,如果不为空,你可以执行相应的登录或注册操作(例如发送请求到服务器进行验证或新用户注册等),这只是一个简单的示例,实际开发中还需要考虑更多的安全性和用户体验方面的因素。





