91 lines
2.8 KiB
JavaScript
91 lines
2.8 KiB
JavaScript
document.addEventListener('DOMContentLoaded', function () {
|
|
// 获取所有的表单
|
|
const forms = document.querySelectorAll('form');
|
|
|
|
forms.forEach(function (form) {
|
|
// 检查是否包含 normal 属性，若有则跳过
|
|
if (form.hasAttribute('normal')) {
|
|
return; // 跳过此表单
|
|
}
|
|
|
|
// 移除之前可能绑定的事件监听器，确保不会重复绑定
|
|
form.removeEventListener('submit', handleFormSubmit);
|
|
|
|
// 绑定新的事件监听器
|
|
form.addEventListener('submit', handleFormSubmit);
|
|
});
|
|
|
|
function handleFormSubmit(event) {
|
|
event.preventDefault(); // 阻止默认提交
|
|
|
|
const form = event.target;
|
|
|
|
// 添加防止重复提交的标志
|
|
if (form.dataset.isSubmitting === 'true') {
|
|
return; // 如果已经在提交，则直接返回，防止重复提交
|
|
}
|
|
|
|
form.dataset.isSubmitting = 'true'; // 标记表单为正在提交
|
|
|
|
// 获取表单中的提交按钮
|
|
const submitButton = form.querySelector('button[type="submit"]');
|
|
|
|
// 给提交按钮设置禁用状态
|
|
if (submitButton) {
|
|
submitButton.disabled = true;
|
|
}
|
|
|
|
// 给id为 rk-form-load 的元素添加 rk-a-show class
|
|
const loader = document.getElementById('rk-form-load');
|
|
if (loader) {
|
|
loader.classList.remove('rk-a-hidden');
|
|
loader.classList.add('rk-a-show');
|
|
}
|
|
|
|
// 使用 FormData 对象获取表单数据
|
|
const formData = new FormData(form);
|
|
|
|
// 使用 fetch 发起请求
|
|
fetch(form.action, {
|
|
method: form.method,
|
|
body: formData,
|
|
})
|
|
|
|
.then(response => response.text()) // 获取纯文本响应
|
|
.then(data => {
|
|
// 提交成功时的处理
|
|
rk.tip('Tip', data, 3); // 使用 rk.tip 输出提示
|
|
|
|
// 延迟移除加载的 rk-a-show 类并添加 rk-a-hidden 类
|
|
setTimeout(() => {
|
|
if (loader) {
|
|
loader.classList.remove('rk-a-show');
|
|
loader.classList.add('rk-a-hidden');
|
|
}
|
|
// 恢复提交按钮的可点击状态
|
|
if (submitButton) {
|
|
submitButton.disabled = false;
|
|
}
|
|
form.dataset.isSubmitting = 'false'; // 解除提交锁定
|
|
}, 500); // 延迟 0.5 秒
|
|
})
|
|
.catch(error => {
|
|
// 处理错误情况
|
|
rk.tip('错误', '提交出错: ' + error.message, 3); // 使用 rk.tip 输出错误信息
|
|
|
|
// 延迟移除加载的 rk-a-show 类并添加 rk-a-hidden 类
|
|
setTimeout(() => {
|
|
if (loader) {
|
|
loader.classList.add('rk-a-hidden');
|
|
loader.classList.remove('rk-a-show');
|
|
}
|
|
// 恢复提交按钮的可点击状态
|
|
if (submitButton) {
|
|
submitButton.disabled = false;
|
|
}
|
|
form.dataset.isSubmitting = 'false'; // 解除提交锁定
|
|
}, 500); // 延迟 0.5 秒
|
|
});
|
|
}
|
|
});
|