|
|
|
@ -49,7 +49,6 @@ |
|
|
|
.input-focus { |
|
|
|
@apply focus:border-primary focus:ring-2 focus:ring-primary/20 focus:outline-none; |
|
|
|
} |
|
|
|
/* 图标容器样式 - 确保绝对居中 */ |
|
|
|
.form-icon-container { |
|
|
|
@apply absolute inset-y-0 left-0 flex items-center pl-3.5 pointer-events-none z-10; |
|
|
|
} |
|
|
|
@ -62,12 +61,10 @@ |
|
|
|
.form-label { |
|
|
|
@apply block text-gray-700 font-medium mb-2; |
|
|
|
} |
|
|
|
/* 统一输入框高度和内边距 */ |
|
|
|
.form-control { |
|
|
|
@apply w-full pl-10 py-3 border border-gray-300 rounded-lg input-focus transition-colors; |
|
|
|
height: 54px; /* 固定高度确保垂直对齐 */ |
|
|
|
height: 54px; |
|
|
|
} |
|
|
|
/* 选择框样式统一 */ |
|
|
|
.form-select { |
|
|
|
@apply form-control pr-8 appearance-none bg-white; |
|
|
|
background-image: url('data:image/svg+xml;charset=US-ASCII,<svg width=\"20\" height=\"20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z\" fill=\"%23333\"/></svg>'); |
|
|
|
@ -79,7 +76,6 @@ |
|
|
|
</style> |
|
|
|
|
|
|
|
<style> |
|
|
|
/* 基础动画 */ |
|
|
|
@keyframes fadeIn { |
|
|
|
from { |
|
|
|
opacity: 0; |
|
|
|
@ -108,19 +104,56 @@ |
|
|
|
animation-delay: 0.3s; |
|
|
|
} |
|
|
|
|
|
|
|
/* 确保所有输入控件垂直对齐 */ |
|
|
|
input.form-control, |
|
|
|
select.form-select { |
|
|
|
box-sizing: border-box; |
|
|
|
vertical-align: middle; |
|
|
|
} |
|
|
|
|
|
|
|
/* 解决不同浏览器下select元素的高度差异 */ |
|
|
|
select.form-select { |
|
|
|
-webkit-appearance: none; |
|
|
|
-moz-appearance: none; |
|
|
|
appearance: none; |
|
|
|
} |
|
|
|
|
|
|
|
.loading-overlay { |
|
|
|
position: fixed; |
|
|
|
top: 0; |
|
|
|
left: 0; |
|
|
|
right: 0; |
|
|
|
bottom: 0; |
|
|
|
background: rgba(0, 0, 0, 0.6); |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
justify-content: center; |
|
|
|
z-index: 9999; |
|
|
|
flex-direction: column; |
|
|
|
} |
|
|
|
|
|
|
|
.spinner { |
|
|
|
width: 50px; |
|
|
|
height: 50px; |
|
|
|
border: 4px solid #f3f3f3; |
|
|
|
border-top: 4px solid #3B82F6; |
|
|
|
border-radius: 50%; |
|
|
|
animation: spin 1s linear infinite; |
|
|
|
} |
|
|
|
|
|
|
|
@keyframes spin { |
|
|
|
0% { |
|
|
|
transform: rotate(0deg); |
|
|
|
} |
|
|
|
|
|
|
|
100% { |
|
|
|
transform: rotate(360deg); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.loading-text { |
|
|
|
color: white; |
|
|
|
margin-top: 15px; |
|
|
|
font-size: 16px; |
|
|
|
} |
|
|
|
</style> |
|
|
|
</head> |
|
|
|
|
|
|
|
@ -138,51 +171,46 @@ |
|
|
|
class="text-xl font-bold bg-clip-text text-transparent bg-gradient-to-r from-primary to-secondary">夺宝奇兵免费体验</span> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- 桌面导航 --> |
|
|
|
<nav class="hidden md:flex items-center space-x-8"> |
|
|
|
<a href="hkhcdbqb.html" class="hover:text-primary transition-colors">首页</a> |
|
|
|
<a href="hkhcdbqbDownload.html" class="hover:text-primary transition-colors">下载中心</a> |
|
|
|
<a href="hkhcdbqbGuide.html" class="text-primary font-medium">操作指南</a> |
|
|
|
<a href="https://wa.me/+6588792879?text=我要体验夺宝奇兵" target="_blank" |
|
|
|
<a href="https://wa.me/+6588792879?text=我要了解夺宝奇兵" target="_blank" |
|
|
|
class="px-5 py-2 rounded-full bg-gradient-to-r from-primary to-secondary text-white hover:shadow-lg transition-all">联系我们</a> |
|
|
|
</nav> |
|
|
|
|
|
|
|
<!-- 移动端菜单 --> |
|
|
|
<button id="mobileMenuBtn" class="md:hidden text-xl"> |
|
|
|
<i class="fa fa-bars"></i> |
|
|
|
</button> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- 移动端菜单内容 --> |
|
|
|
<div id="mobileMenu" class="md:hidden hidden bg-white border-t"> |
|
|
|
<div class="container mx-auto px-4 py-3 flex flex-col space-y-3"> |
|
|
|
<a href="hkhcdbqb.html" class="py-2 hover:text-primary transition-colors">首页</a> |
|
|
|
<a href="hkhcdbqbDownload.html" class="py-2 hover:text-primary transition-colors">下载中心</a> |
|
|
|
<a href="hkhcdbqbGuide.html" class="py-2 text-primary">操作指南</a> |
|
|
|
<a href="https://wa.me/+6588792879?text=我要体验夺宝奇兵" target="_blank" |
|
|
|
<a href="https://wa.me/+6588792879?text=我要了解夺宝奇兵" target="_blank" |
|
|
|
class="py-2 mt-2 rounded-full bg-gradient-to-r from-primary to-secondary text-white text-center">联系我们</a> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</header> |
|
|
|
|
|
|
|
<!-- 主要内容 --> |
|
|
|
|
|
|
|
<main class="pt-28 pb-16 px-4"> |
|
|
|
<div class="container mx-auto max-w-6xl"> |
|
|
|
<!-- 页面标题 --> |
|
|
|
<div class="text-center mb-12 fade-in"> |
|
|
|
<h1 class="text-[clamp(1.8rem,4vw,2.5rem)] font-bold mb-4">夺宝奇兵+内部班级课程<br />免费体验</h1> |
|
|
|
<p class="text-gray-600 max-w-2xl mx-auto">财富粉报名即可获得体验的机会！<br />超级云脑 夺宝利剑 AI预测大模型</p> |
|
|
|
<p class="text-gray-600 max-w-2xl mx-auto">AD粉报名即可获得体验的机会！<br />超级云脑 夺宝利剑 AI预测大模型</p> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="grid grid-cols-1 lg:grid-cols-5 gap-8 max-w-5xl mx-auto"> |
|
|
|
<!-- 注册表单 --> |
|
|
|
<div class="lg:col-span-3 fade-in delay-100"> |
|
|
|
<div class="bg-white rounded-xl shadow-md p-6 md:p-8 card-hover"> |
|
|
|
<form id="registrationForm" action="./hkRegisterTip.html" method="post"> |
|
|
|
<!-- 姓名 --> |
|
|
|
<!-- 注意：移除了 action 和 method，由JS处理 --> |
|
|
|
<form id="registrationForm"> |
|
|
|
<div class="form-group"> |
|
|
|
<label for="fullname" class="form-label">姓名 <span class="text-red-500">*</span></label> |
|
|
|
<label class="form-label">姓名 <span class="text-red-500">*</span></label> |
|
|
|
<div class="relative"> |
|
|
|
<div class="form-icon-container"> |
|
|
|
<i class="form-icon fa fa-user"></i> |
|
|
|
@ -190,92 +218,54 @@ |
|
|
|
<input type="text" id="unameinfo" name="unameinfo" class="form-control" |
|
|
|
autocomplete="off" placeholder="请输入您的姓名"> |
|
|
|
</div> |
|
|
|
<div id="nameError" class="text-red-500" style="display: none;">请输入您的姓名 [ Please enter |
|
|
|
your name ] </div> |
|
|
|
<div id="nameError" class="text-red-500 text-sm mt-1" style="display: none;">请输入您的姓名 |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- 手机号 - 图标垂直居中优化 --> |
|
|
|
<div class="form-group"> |
|
|
|
<label class="form-label">手机号码 <span class="text-red-500">*</span></label> |
|
|
|
<input type="hidden" name="zbtype" id="zbtype" value="2"> |
|
|
|
<div class="flex gap-3"> |
|
|
|
<!-- 国家编号选择框 --> |
|
|
|
<div class="w-30 relative"> |
|
|
|
<div class="form-icon-container"> |
|
|
|
<i class="form-icon fa fa-globe"></i> |
|
|
|
</div> |
|
|
|
<select name="countryinfo" id="countryinfo" class="form-select"> |
|
|
|
|
|
|
|
<option value="+65">+65 新加坡</option> |
|
|
|
|
|
|
|
<option value="+60">+60 马来西亚</option> |
|
|
|
|
|
|
|
<option value="+852">+852 香港</option> |
|
|
|
|
|
|
|
<option value="+1" selected='selected'>+1 美国</option> |
|
|
|
|
|
|
|
<option value="+1" selected="selected">+1 美国</option> |
|
|
|
<option value="+62">+62 印尼</option> |
|
|
|
|
|
|
|
<option value="+1">+1 加拿大</option> |
|
|
|
|
|
|
|
<option value="+61">+61 澳大利亚</option> |
|
|
|
|
|
|
|
<option value="+673">+673 文莱</option> |
|
|
|
|
|
|
|
<option value="+886">+886 台湾</option> |
|
|
|
|
|
|
|
<option value="+86">+86 中国</option> |
|
|
|
|
|
|
|
<option value="+0">+0 其他</option> |
|
|
|
|
|
|
|
<option value="+64">+64 新西兰</option> |
|
|
|
|
|
|
|
<option value="+44">+44 英国</option> |
|
|
|
|
|
|
|
<option value="+81">+81 日本</option> |
|
|
|
|
|
|
|
<option value="+49">+49 德国</option> |
|
|
|
|
|
|
|
<option value="+82">+82 韩国</option> |
|
|
|
|
|
|
|
<option value="+84 ">+84 越南</option> |
|
|
|
|
|
|
|
<option value="+84">+84 越南</option> |
|
|
|
<option value="+971">+971 阿联酋</option> |
|
|
|
|
|
|
|
<option value="+45">+45 丹麦</option> |
|
|
|
|
|
|
|
<option value="+853">+853 澳门</option> |
|
|
|
|
|
|
|
<option value="+66">+66 泰国</option> |
|
|
|
|
|
|
|
<option value="+91">+91 印度</option> |
|
|
|
|
|
|
|
<option value="+41">+41 瑞士</option> |
|
|
|
|
|
|
|
<option value="+358">+358 芬兰</option> |
|
|
|
|
|
|
|
<option value="+33">+33 法国</option> |
|
|
|
|
|
|
|
<option value="+63">+63 菲律宾</option> |
|
|
|
|
|
|
|
<option value="+31">+31 荷兰</option> |
|
|
|
|
|
|
|
<option value="+46">+46 瑞典</option> |
|
|
|
|
|
|
|
<option value="+34">+34 西班牙</option> |
|
|
|
|
|
|
|
<option value="+54">+54 阿根廷</option> |
|
|
|
|
|
|
|
<option value="+39">+39 意大利</option> |
|
|
|
|
|
|
|
<option value="+7">+7 俄罗斯</option> |
|
|
|
|
|
|
|
<option value="+420">+420 捷克</option> |
|
|
|
|
|
|
|
</select> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- 手机号输入框 --> |
|
|
|
<div class="flex-1 relative"> |
|
|
|
<div class="form-icon-container"> |
|
|
|
<i class="form-icon fa fa-whatsapp"></i> |
|
|
|
@ -285,26 +275,23 @@ |
|
|
|
autocomplete="off" placeholder="不带国家编号的纯机号"> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div id="phoneError" class="text-red-500" style="display: none;">请输入正确的手机号（纯手机号 不含国家编号 ） |
|
|
|
</div> |
|
|
|
<div id="phoneError" class="text-red-500 text-sm mt-1" style="display: none;"> |
|
|
|
请输入正确的手机号（纯手机号，不含国家编号）</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- 微信ID --> |
|
|
|
<div class="form-group"> |
|
|
|
<label for="wechat" class="form-label">微信ID <span class="text-red-500"></span></label> |
|
|
|
<label class="form-label">微信ID</label> |
|
|
|
<div class="relative"> |
|
|
|
<div class="form-icon-container"> |
|
|
|
<i class="form-icon fa fa-weixin"></i> |
|
|
|
</div> |
|
|
|
<input type="text" id="uwechat" name="uwechat" class="form-control" |
|
|
|
placeholder="微信ID ( 如没有WhatsApp )" autocomplete="off"> |
|
|
|
placeholder="微信ID（如没有WhatsApp）" autocomplete="off"> |
|
|
|
</div> |
|
|
|
<div id="wechatError" class="text-red-500" style="display: none;">请输入微信ID</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- 邮箱地址 --> |
|
|
|
<div class="form-group mb-6"> |
|
|
|
<label for="email" class="form-label">邮箱地址 <span class="text-red-500">*</span></label> |
|
|
|
<label class="form-label">邮箱地址 <span class="text-red-500">*</span></label> |
|
|
|
<div class="relative"> |
|
|
|
<div class="form-icon-container"> |
|
|
|
<i class="form-icon fa fa-envelope"></i> |
|
|
|
@ -312,11 +299,11 @@ |
|
|
|
<input type="email" id="uemail" name="uemail" class="form-control" |
|
|
|
autocomplete="off" placeholder="请输入您的邮箱地址"> |
|
|
|
</div> |
|
|
|
<div id="emailError" class="text-red-500" style="display: none;">请输入您的有效邮箱地址</div> |
|
|
|
<div id="emailError" class="text-red-500 text-sm mt-1" style="display: none;"> |
|
|
|
请输入您的有效邮箱地址</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- 提交按钮 --> |
|
|
|
<button type="submit" |
|
|
|
<button type="submit" id="submitBtn" |
|
|
|
class="btn-effect w-full py-3 rounded-lg bg-gradient-to-r from-primary to-secondary text-white font-medium text-lg"> |
|
|
|
<i class="fa fa-check-circle mr-2"></i>提交注册 |
|
|
|
</button> |
|
|
|
@ -368,19 +355,19 @@ |
|
|
|
</div> |
|
|
|
<p>邮箱作为联系您的备用联系方式。</p> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="mt-6 pt-5 border-t border-gray-100"> |
|
|
|
<h4 class="font-semibold mb-3 text-gray-700">温馨提示</h4> |
|
|
|
<p class="text-sm"> |
|
|
|
财富粉可以进入HomilyLink内部班级群<br />免费学习。<br /> |
|
|
|
AD粉可以进入HomilyLink内部班级群<br />免费学习。<br /> |
|
|
|
免费体验包括：夺宝奇兵三大模板<br /> |
|
|
|
铁粉可以体验部分DeepChart功能！ |
|
|
|
</p> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="mt-6 pt-5 border-t border-gray-100"> |
|
|
|
<h4 class="font-semibold mb-3 text-gray-700">郑重声明</h4> |
|
|
|
<p class="text-sm"> |
|
|
|
我们将严格保护您的个人信息安全，绝对不会向第三方泄露。<br /> |
|
|
|
</p> |
|
|
|
<p class="text-sm">我们将严格保护您的个人信息安全，绝对不会向第三方泄露。</p> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
@ -405,13 +392,14 @@ |
|
|
|
</div> |
|
|
|
</footer> |
|
|
|
|
|
|
|
<!-- 交互脚本 --> |
|
|
|
<!-- 交互脚本 - 使用 type="module" 保留原有API导入 --> |
|
|
|
<script type="module"> |
|
|
|
// 从外部文件导入 registerMemberApi 函数 |
|
|
|
// 从外部文件导入 registerMemberApi 函数（保持原有方式） |
|
|
|
import { registerMemberApi } from './src/api/hkmember.js'; |
|
|
|
|
|
|
|
// 获取表单元素 |
|
|
|
const form = document.getElementById('registrationForm'); |
|
|
|
const submitBtn = document.getElementById('submitBtn'); |
|
|
|
|
|
|
|
// 错误提示元素 |
|
|
|
const nameError = document.getElementById('nameError'); |
|
|
|
@ -420,13 +408,19 @@ |
|
|
|
|
|
|
|
// 隐藏所有错误提示 |
|
|
|
function hideAllErrors() { |
|
|
|
nameError.style.display = 'none'; |
|
|
|
phoneError.style.display = 'none'; |
|
|
|
emailError.style.display = 'none'; |
|
|
|
if (nameError) nameError.style.display = 'none'; |
|
|
|
if (phoneError) phoneError.style.display = 'none'; |
|
|
|
if (emailError) emailError.style.display = 'none'; |
|
|
|
} |
|
|
|
|
|
|
|
// 显示错误 |
|
|
|
function showError(element) { |
|
|
|
if (element) element.style.display = 'block'; |
|
|
|
} |
|
|
|
|
|
|
|
// 邮箱校验 |
|
|
|
function isValidEmail(email) { |
|
|
|
if (!email || email.trim() === '') return false; |
|
|
|
const emailRegex = /^[^\s@]+@([^\s@]+\.)+[^\s@]+$/; |
|
|
|
if (!emailRegex.test(email)) return false; |
|
|
|
if (email.length > 254) return false; |
|
|
|
@ -450,9 +444,53 @@ |
|
|
|
return cleaned; |
|
|
|
} |
|
|
|
|
|
|
|
// 表单提交处理 - 先调用API保存数据，然后继续表单提交跳转 |
|
|
|
// 显示加载状态 |
|
|
|
function showLoading() { |
|
|
|
const loadingDiv = document.createElement('div'); |
|
|
|
loadingDiv.id = 'loadingOverlay'; |
|
|
|
loadingDiv.className = 'loading-overlay'; |
|
|
|
loadingDiv.innerHTML = '<div class="spinner"></div><div class="loading-text">正在提交注册信息...</div>'; |
|
|
|
document.body.appendChild(loadingDiv); |
|
|
|
|
|
|
|
if (submitBtn) { |
|
|
|
submitBtn.disabled = true; |
|
|
|
submitBtn.style.opacity = '0.6'; |
|
|
|
submitBtn.innerHTML = '<i class="fa fa-spinner fa-spin mr-2"></i>提交中...'; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
// 隐藏加载状态 |
|
|
|
function hideLoading() { |
|
|
|
const loadingDiv = document.getElementById('loadingOverlay'); |
|
|
|
if (loadingDiv) loadingDiv.remove(); |
|
|
|
|
|
|
|
if (submitBtn) { |
|
|
|
submitBtn.disabled = false; |
|
|
|
submitBtn.style.opacity = '1'; |
|
|
|
submitBtn.innerHTML = '<i class="fa fa-check-circle mr-2"></i>提交注册'; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
// 使用 GET 方式跳转到提示页面（避免 Nginx 405 错误） |
|
|
|
function redirectToSuccessPage(formData) { |
|
|
|
const params = new URLSearchParams(); |
|
|
|
params.set('unameinfo', formData.name); |
|
|
|
params.set('countryinfo', formData.countryCode); |
|
|
|
params.set('umoblie', formData.phone); |
|
|
|
params.set('uemail', formData.email); |
|
|
|
if (formData.wechat) params.set('uwechat', formData.wechat); |
|
|
|
params.set('zbtype', formData.zbtype); |
|
|
|
|
|
|
|
// GET 方式跳转，不会出现 405 错误 |
|
|
|
window.location.href = `./hkRegisterTip.html?${params.toString()}`; |
|
|
|
} |
|
|
|
|
|
|
|
// 表单提交处理 - 先调用API保存数据，然后GET跳转 |
|
|
|
form.addEventListener('submit', async function (e) { |
|
|
|
// 先进行前端校验 |
|
|
|
// 阻止默认提交 |
|
|
|
e.preventDefault(); |
|
|
|
|
|
|
|
// 前端校验 |
|
|
|
hideAllErrors(); |
|
|
|
|
|
|
|
const name = document.getElementById('unameinfo').value.trim(); |
|
|
|
@ -460,36 +498,33 @@ |
|
|
|
const phoneRaw = document.getElementById('umoblie').value.trim(); |
|
|
|
const wechat = document.getElementById('uwechat').value.trim(); |
|
|
|
const email = document.getElementById('uemail').value.trim(); |
|
|
|
const zbtype = document.getElementById('zbtype').value; |
|
|
|
|
|
|
|
let isValid = true; |
|
|
|
|
|
|
|
if (!name) { |
|
|
|
nameError.style.display = 'block'; |
|
|
|
showError(nameError); |
|
|
|
isValid = false; |
|
|
|
} |
|
|
|
|
|
|
|
if (!phoneRaw || !isValidPhone(phoneRaw)) { |
|
|
|
phoneError.style.display = 'block'; |
|
|
|
showError(phoneError); |
|
|
|
isValid = false; |
|
|
|
} |
|
|
|
|
|
|
|
if (!email || !isValidEmail(email)) { |
|
|
|
emailError.style.display = 'block'; |
|
|
|
showError(emailError); |
|
|
|
isValid = false; |
|
|
|
} |
|
|
|
|
|
|
|
if (!isValid) { |
|
|
|
e.preventDefault(); |
|
|
|
return; |
|
|
|
} |
|
|
|
|
|
|
|
// 阻止默认提交，先调用API |
|
|
|
e.preventDefault(); |
|
|
|
|
|
|
|
// 清理手机号 |
|
|
|
const cleanedPhone = cleanPhoneNumber(phoneRaw); |
|
|
|
|
|
|
|
// 组装请求参数 |
|
|
|
// 组装请求参数（与原来保持一致） |
|
|
|
const requestData = { |
|
|
|
name: name, |
|
|
|
code: countryCode, |
|
|
|
@ -501,23 +536,48 @@ |
|
|
|
requestData.weChat = wechat; |
|
|
|
} |
|
|
|
|
|
|
|
// 保存表单数据用于跳转 |
|
|
|
const formData = { |
|
|
|
name: name, |
|
|
|
countryCode: countryCode, |
|
|
|
phone: cleanedPhone, |
|
|
|
wechat: wechat, |
|
|
|
email: email, |
|
|
|
zbtype: zbtype |
|
|
|
}; |
|
|
|
|
|
|
|
// 显示加载状态 |
|
|
|
showLoading(); |
|
|
|
|
|
|
|
try { |
|
|
|
// 调用原有的 API 接口保存数据 |
|
|
|
const result = await registerMemberApi(requestData); |
|
|
|
|
|
|
|
if (result.code === 200) { |
|
|
|
// API调用成功，继续表单提交跳转 |
|
|
|
form.submit(); |
|
|
|
// API调用成功，GET方式跳转到提示页面 |
|
|
|
redirectToSuccessPage(formData); |
|
|
|
} else { |
|
|
|
hideLoading(); |
|
|
|
alert('注册失败：' + (result.msg || '未知错误，请稍后重试')); |
|
|
|
} |
|
|
|
} catch (error) { |
|
|
|
console.error('提交注册出错:', error); |
|
|
|
alert('网络错误或接口异常，请稍后重试'); |
|
|
|
hideLoading(); |
|
|
|
|
|
|
|
// API失败时，询问是否继续（数据未保存到后端） |
|
|
|
if (confirm('网络错误，注册失败。请检查网络后重试。\n\n是否返回表单重新提交？')) { |
|
|
|
// 用户选择重试，停留在当前页面 |
|
|
|
return; |
|
|
|
} |
|
|
|
} |
|
|
|
}); |
|
|
|
|
|
|
|
// 移动端菜单切换 |
|
|
|
document.getElementById('mobileMenuBtn').addEventListener('click', function () { |
|
|
|
const mobileMenuBtn = document.getElementById('mobileMenuBtn'); |
|
|
|
if (mobileMenuBtn) { |
|
|
|
mobileMenuBtn.addEventListener('click', function () { |
|
|
|
const menu = document.getElementById('mobileMenu'); |
|
|
|
if (menu) { |
|
|
|
menu.classList.toggle('hidden'); |
|
|
|
const icon = this.querySelector('i'); |
|
|
|
if (icon.classList.contains('fa-bars')) { |
|
|
|
@ -525,7 +585,9 @@ |
|
|
|
} else { |
|
|
|
icon.classList.replace('fa-times', 'fa-bars'); |
|
|
|
} |
|
|
|
} |
|
|
|
}); |
|
|
|
} |
|
|
|
|
|
|
|
// 页面加载动画 |
|
|
|
document.addEventListener('DOMContentLoaded', function () { |
|
|
|
@ -533,6 +595,29 @@ |
|
|
|
el.style.opacity = '1'; |
|
|
|
}); |
|
|
|
}); |
|
|
|
|
|
|
|
// 输入框实时验证 |
|
|
|
const nameInput = document.getElementById('unameinfo'); |
|
|
|
const phoneInput = document.getElementById('umoblie'); |
|
|
|
const emailInput = document.getElementById('uemail'); |
|
|
|
|
|
|
|
if (nameInput) { |
|
|
|
nameInput.addEventListener('blur', function () { |
|
|
|
if (this.value.trim()) nameError.style.display = 'none'; |
|
|
|
}); |
|
|
|
} |
|
|
|
|
|
|
|
if (phoneInput) { |
|
|
|
phoneInput.addEventListener('blur', function () { |
|
|
|
if (this.value.trim() && isValidPhone(this.value.trim())) phoneError.style.display = 'none'; |
|
|
|
}); |
|
|
|
} |
|
|
|
|
|
|
|
if (emailInput) { |
|
|
|
emailInput.addEventListener('blur', function () { |
|
|
|
if (this.value.trim() && isValidEmail(this.value.trim())) emailError.style.display = 'none'; |
|
|
|
}); |
|
|
|
} |
|
|
|
</script> |
|
|
|
</body> |
|
|
|
|
zhaoruhui
11 hours ago