注册页面js代码怎么写

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>注册页面</title>
</head>
<body>
    <form id="registerForm" action="/register" method="post">
        <label for="username">用户名:</label>
        <input type="text" id="username" name="username" required><br><br>

        <label for="email">邮箱:</label>
        <input type="email" id="email" name="email" required><br><br>

        <label for="password">密码:</label>
        <input type="password" id="password" name="password" required><br><br>

        <label for="confirmPassword">确认密码:</label>
        <input type="password" id="confirmPassword" name="confirmPassword" required><br><br>

        <button type="submit">注册</button>
    </form>

    <script src="register.js"></script>
</body>
</html>

document.getElementById('registerForm').addEventListener('submit', function(event) {
    let isValid = true;
    const username = document.getElementById('username').value;
    const email = document.getElementById('email').value;
    const password = document.getElementById('password').value;
    const confirmPassword = document.getElementById('confirmPassword').value;

    // 用户名验证
    if (username.length < 4 || username.length > 20) {
        alert('用户名长度必须在4到20个字符之间');
        isValid = false;
    }

    // 邮箱验证
    const emailPattern = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/;
    if (!emailPattern.test(email)) {
        alert('请输入有效的邮箱地址');
        isValid = false;
    }

    // 密码验证
    if (password.length < 6 || password.length > 25) {
        alert('密码长度必须在6到25个字符之间');
        isValid = false;
    }

    // 确认密码验证
    if (password !== confirmPassword) {
        alert('两次输入的密码不一致');
        isValid = false;
    }

    if (!isValid) {
        event.preventDefault(); // 阻止表单提交
    }
});