117 lines
4.0 KiB
JavaScript
117 lines
4.0 KiB
JavaScript
// 注册页面JavaScript功能
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
const sendBtn = document.getElementById('sendEmailCodeBtn');
|
|
const emailInput = document.getElementById('emailInput');
|
|
const btnText = document.getElementById('btnText');
|
|
const passwordInput = document.getElementById('passwordInput');
|
|
const confirmPasswordInput = document.getElementById('confirmPasswordInput');
|
|
const passwordMatchMessage = document.getElementById('passwordMatchMessage');
|
|
let countdown = 0;
|
|
let timer = null;
|
|
|
|
// 密码确认实时验证
|
|
function checkPasswordMatch() {
|
|
const password = passwordInput.value;
|
|
const confirmPassword = confirmPasswordInput.value;
|
|
|
|
if (confirmPassword === '') {
|
|
passwordMatchMessage.textContent = '';
|
|
passwordMatchMessage.className = 'form-text';
|
|
return;
|
|
}
|
|
|
|
if (password === confirmPassword) {
|
|
passwordMatchMessage.textContent = '✓ 密码匹配';
|
|
passwordMatchMessage.className = 'form-text text-success';
|
|
confirmPasswordInput.classList.remove('is-invalid');
|
|
confirmPasswordInput.classList.add('is-valid');
|
|
} else {
|
|
passwordMatchMessage.textContent = '✗ 密码不匹配';
|
|
passwordMatchMessage.className = 'form-text text-danger';
|
|
confirmPasswordInput.classList.remove('is-valid');
|
|
confirmPasswordInput.classList.add('is-invalid');
|
|
}
|
|
}
|
|
|
|
// 监听密码输入
|
|
passwordInput.addEventListener('input', checkPasswordMatch);
|
|
confirmPasswordInput.addEventListener('input', checkPasswordMatch);
|
|
|
|
// 发送验证码
|
|
sendBtn.addEventListener('click', function() {
|
|
const email = emailInput.value.trim();
|
|
|
|
// 简单的邮箱格式验证
|
|
const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
|
|
if (!email) {
|
|
alert('请输入邮箱地址');
|
|
emailInput.focus();
|
|
return;
|
|
}
|
|
|
|
if (!emailRegex.test(email)) {
|
|
alert('请输入有效的邮箱地址');
|
|
emailInput.focus();
|
|
return;
|
|
}
|
|
|
|
// 发送AJAX请求
|
|
fetch('/auth/send_email_code', {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
'X-CSRFToken': document.querySelector('input[name="csrf_token"]').value
|
|
},
|
|
body: JSON.stringify({
|
|
email: email,
|
|
type: 1 // 1表示注册
|
|
})
|
|
})
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
if (data.success) {
|
|
alert('验证码已发送到您的邮箱，请查收！');
|
|
startCountdown();
|
|
} else {
|
|
alert(data.message || '发送失败，请重试');
|
|
}
|
|
})
|
|
.catch(error => {
|
|
console.error('Error:', error);
|
|
alert('发送失败，请检查网络连接');
|
|
});
|
|
});
|
|
|
|
// 倒计时功能
|
|
function startCountdown() {
|
|
countdown = 60;
|
|
sendBtn.disabled = true;
|
|
sendBtn.classList.add('disabled');
|
|
|
|
timer = setInterval(function() {
|
|
btnText.textContent = `${countdown}秒后重发`;
|
|
countdown--;
|
|
|
|
if (countdown < 0) {
|
|
clearInterval(timer);
|
|
sendBtn.disabled = false;
|
|
sendBtn.classList.remove('disabled');
|
|
btnText.textContent = '发送验证码';
|
|
}
|
|
}, 1000);
|
|
}
|
|
|
|
// 表单提交前验证
|
|
document.getElementById('registerForm').addEventListener('submit', function(e) {
|
|
const password = passwordInput.value;
|
|
const confirmPassword = confirmPasswordInput.value;
|
|
|
|
if (password !== confirmPassword) {
|
|
e.preventDefault();
|
|
alert('两次输入的密码不一致，请重新输入');
|
|
confirmPasswordInput.focus();
|
|
return false;
|
|
}
|
|
});
|
|
});
|