重构关于我们、商家申请和案例页面,优化布局和内容展示
This commit is contained in:
@@ -32,6 +32,9 @@ document.addEventListener('DOMContentLoaded', function() {
|
||||
|
||||
// 初始化页面交互
|
||||
initPageInteractions();
|
||||
|
||||
// 初始化表单处理
|
||||
initForms();
|
||||
});
|
||||
|
||||
// 创建滚动进度条
|
||||
@@ -195,6 +198,50 @@ function initCallToAction() {
|
||||
});
|
||||
}
|
||||
|
||||
// 表单处理功能
|
||||
function initForms() {
|
||||
const forms = document.querySelectorAll('form');
|
||||
|
||||
forms.forEach(form => {
|
||||
form.addEventListener('submit', function(e) {
|
||||
e.preventDefault();
|
||||
|
||||
// 表单验证
|
||||
if (this.checkValidity()) {
|
||||
// 显示提交成功消息
|
||||
showFormSuccess(this);
|
||||
// 重置表单
|
||||
this.reset();
|
||||
} else {
|
||||
// 显示验证错误
|
||||
this.reportValidity();
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
// 显示表单提交成功消息
|
||||
function showFormSuccess(form) {
|
||||
// 创建成功消息
|
||||
const successMessage = document.createElement('div');
|
||||
successMessage.className = 'alert alert-success alert-dismissible fade show';
|
||||
successMessage.innerHTML = `
|
||||
<i class="fa fa-check-circle me-2"></i>
|
||||
提交成功!我们会尽快与您联系。
|
||||
<button type="button" class="btn-close" data-bs-dismiss="alert"></button>
|
||||
`;
|
||||
|
||||
// 插入到表单前面
|
||||
form.parentNode.insertBefore(successMessage, form);
|
||||
|
||||
// 5秒后自动消失
|
||||
setTimeout(() => {
|
||||
if (successMessage.parentNode) {
|
||||
successMessage.remove();
|
||||
}
|
||||
}, 5000);
|
||||
}
|
||||
|
||||
// 页面性能优化:图片懒加载
|
||||
function initLazyLoading() {
|
||||
if ('IntersectionObserver' in window) {
|
||||
|
||||
Reference in New Issue
Block a user