From 8d5116ae53b05946c2ec3bacc427271b0d0d5e4b Mon Sep 17 00:00:00 2001
From: zhaoruhui <national_zrh@163.com>
Date: Sat, 11 Apr 2026 16:48:05 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E8=B7=B3=E8=BD=AC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 hkRegister.html | 192 ++++++++++++++++++++++++++++++++++----------------------
 1 file changed, 118 insertions(+), 74 deletions(-)
diff --git a/hkRegister.html b/hkRegister.html
index 2041680..8e70ea1 100644
--- a/hkRegister.html
+++ b/hkRegister.html
@@ -13,9 +13,11 @@
     <meta http-equiv="keywords" content="夺宝奇兵,homilychart,homilylink,DeepChart">
     <meta http-equiv="description" content="HomilyLink">
     <title>夺宝奇兵免费体验</title>
+    <!-- 引入外部资源 -->
     <script src="https://cdn.tailwindcss.com?v=3.3.5"></script>
     <link href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css" rel="stylesheet">
 
+    <!-- 基础样式配置 -->
     <script>
         tailwind.config = {
             theme: {
@@ -152,14 +154,11 @@
             margin-top: 15px;
             font-size: 16px;
         }
-
-        button:disabled {
-            cursor: not-allowed;
-        }
     </style>
 </head>
 
 <body class="bg-gray-50 text-gray-800 font-sans">
+    <!-- 导航栏 -->
     <header class="fixed top-0 left-0 right-0 bg-white/95 shadow-sm z-50">
         <div class="container mx-auto px-4 py-4 flex justify-between items-center">
             <div class="flex items-center space-x-2">
@@ -171,6 +170,7 @@
                 <span
                     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>
@@ -178,10 +178,12 @@
                 <a href="https://wa.me/85269518757?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>
@@ -193,6 +195,7 @@
         </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">
@@ -201,10 +204,11 @@
             </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">
-                        <!-- 保持原有 action 和 method，但用 JS 拦截处理 -->
-                        <form id="registrationForm" action="./hkRegisterTip.html" method="post">
+                        <!-- 注意：移除了 action 和 method，由JS处理 -->
+                        <form id="registrationForm">
                             <div class="form-group">
                                 <label class="form-label">姓名 <span class="text-red-500">*</span></label>
                                 <div class="relative">
@@ -261,6 +265,7 @@
                                             <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>
@@ -311,11 +316,13 @@
                     </div>
                 </div>
 
+                <!-- 注册说明 -->
                 <div class="lg:col-span-2 fade-in delay-200">
                     <div class="bg-white rounded-xl shadow-md p-6 md:p-8 h-full card-hover">
                         <h3 class="text-xl font-bold mb-5 flex items-center">
                             <i class="fa fa-info-circle text-primary mr-2"></i>注册说明
                         </h3>
+
                         <div class="space-y-4 text-gray-600">
                             <div class="flex">
                                 <div
@@ -324,6 +331,7 @@
                                 </div>
                                 <p>请填写方便称呼您的姓名信息。</p>
                             </div>
+
                             <div class="flex">
                                 <div
                                     class="w-8 h-8 rounded-full bg-primary/10 flex items-center justify-center text-primary flex-shrink-0 mr-3 mt-0.5">
@@ -331,6 +339,7 @@
                                 </div>
                                 <p>手机号码最好支持WhatsApp联系。</p>
                             </div>
+
                             <div class="flex">
                                 <div
                                     class="w-8 h-8 rounded-full bg-primary/10 flex items-center justify-center text-primary flex-shrink-0 mr-3 mt-0.5">
@@ -338,6 +347,7 @@
                                 </div>
                                 <p>微信的联系方式我们也支持。</p>
                             </div>
+
                             <div class="flex">
                                 <div
                                     class="w-8 h-8 rounded-full bg-primary/10 flex items-center justify-center text-primary flex-shrink-0 mr-3 mt-0.5">
@@ -345,11 +355,16 @@
                                 </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">
-                                    AD粉可以进入HomilyLink内部班级群<br />免费学习。<br />免费体验包括：夺宝奇兵三大模板<br />铁粉可以体验部分DeepChart功能！</p>
+                                    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">我们将严格保护您的个人信息安全，绝对不会向第三方泄露。</p>
@@ -361,6 +376,7 @@
         </div>
     </main>
 
+    <!-- 页脚 -->
     <footer class="bg-gray-900 text-white py-10 px-4 mt-16">
         <div class="container mx-auto max-w-6xl text-center">
             <div class="mb-6">
@@ -376,37 +392,33 @@
         </div>
     </footer>
 
+    <!-- 交互脚本 - 使用 type="module" 保留原有API导入 -->
     <script type="module">
+        // 从外部文件导入 registerMemberApi 函数（保持原有方式）
         import { registerMemberApi } from './src/api/hkmember.js';
 
+        // 获取表单元素
         const form = document.getElementById('registrationForm');
         const submitBtn = document.getElementById('submitBtn');
+
+        // 错误提示元素
         const nameError = document.getElementById('nameError');
         const phoneError = document.getElementById('phoneError');
         const emailError = document.getElementById('emailError');
 
-        // ========== 清理残留loading ==========
-        function cleanupLoading() {
-            const existingOverlay = document.getElementById('loadingOverlay');
-            if (existingOverlay) existingOverlay.remove();
-            if (submitBtn) {
-                submitBtn.disabled = false;
-                submitBtn.style.opacity = '1';
-                submitBtn.innerHTML = '<i class="fa fa-check-circle mr-2"></i>提交注册';
-            }
-            sessionStorage.removeItem('isSubmitting');
-        }
-
+        // 隐藏所有错误提示
         function hideAllErrors() {
             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@]+$/;
@@ -416,6 +428,7 @@
             return true;
         }
 
+        // 手机号校验
         function isValidPhone(phone) {
             if (!phone || phone.trim() === '') return false;
             const digitsOnly = phone.replace(/[^\d]/g, '');
@@ -423,6 +436,7 @@
             return true;
         }
 
+        // 清理手机号
         function cleanPhoneNumber(phone) {
             if (!phone) return '';
             let cleaned = phone.replace(/[^\d]/g, '');
@@ -430,37 +444,53 @@
             return cleaned;
         }
 
+        // 显示加载状态
         function showLoading() {
-            if (document.getElementById('loadingOverlay')) return;
             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>提交中...';
             }
-            sessionStorage.setItem('isSubmitting', 'true');
         }
 
+        // 隐藏加载状态
         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>提交注册';
             }
-            sessionStorage.removeItem('isSubmitting');
         }
 
-        let isSubmitting = false;
+        // 使用 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，成功后继续表单提交（保持原有跳转）
+        // 表单提交处理 - 先调用API保存数据，然后GET跳转
         form.addEventListener('submit', async function (e) {
-            // 先进行前端校验
+            // 阻止默认提交
+            e.preventDefault();
+
+            // 前端校验
             hideAllErrors();
 
             const name = document.getElementById('unameinfo').value.trim();
@@ -468,6 +498,7 @@
             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;
 
@@ -487,93 +518,106 @@
             }
 
             if (!isValid) {
-                e.preventDefault();
                 return;
             }
 
-            // 防止重复提交
-            if (isSubmitting) {
-                e.preventDefault();
-                return;
-            }
-
-            e.preventDefault();
-            isSubmitting = true;
-
+            // 清理手机号
             const cleanedPhone = cleanPhoneNumber(phoneRaw);
+
+            // 组装请求参数（与原来保持一致）
             const requestData = {
                 name: name,
                 code: countryCode,
                 tel: cleanedPhone,
                 email: email
             };
+
             if (wechat) {
                 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调用成功，继续原有的表单提交（POST到hkRegisterTip.html）
-                    hideLoading();
-                    // 重新提交表单（不再拦截）
-                    isSubmitting = false;
-                    form.submit();
+                    // API调用成功，GET方式跳转到提示页面
+                    redirectToSuccessPage(formData);
                 } else {
                     hideLoading();
-                    isSubmitting = false;
                     alert('注册失败：' + (result.msg || '未知错误，请稍后重试'));
                 }
             } catch (error) {
                 console.error('提交注册出错:', error);
                 hideLoading();
-                isSubmitting = false;
-                alert('网络错误或接口异常，请稍后重试');
+
+                // API失败时，询问是否继续（数据未保存到后端）
+                if (confirm('网络错误，注册失败。请检查网络后重试。\n\n是否返回表单重新提交？')) {
+                    // 用户选择重试，停留在当前页面
+                    return;
+                }
             }
         });
 
         // 移动端菜单切换
-        document.getElementById('mobileMenuBtn').addEventListener('click', function () {
-            const menu = document.getElementById('mobileMenu');
-            menu.classList.toggle('hidden');
-            const icon = this.querySelector('i');
-            if (icon.classList.contains('fa-bars')) {
-                icon.classList.replace('fa-bars', 'fa-times');
-            } else {
-                icon.classList.replace('fa-times', 'fa-bars');
-            }
-        });
+        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')) {
+                        icon.classList.replace('fa-bars', 'fa-times');
+                    } else {
+                        icon.classList.replace('fa-times', 'fa-bars');
+                    }
+                }
+            });
+        }
 
-        // 页面加载动画 + 清理残留loading
+        // 页面加载动画
         document.addEventListener('DOMContentLoaded', function () {
             document.querySelectorAll('.fade-in').forEach(el => {
                 el.style.opacity = '1';
             });
-            cleanupLoading();
         });
 
-        // 处理浏览器后退/前进时的残留loading
-        window.addEventListener('pageshow', function (event) {
-            if (event.persisted) {
-                cleanupLoading();
-            }
-        });
-        window.addEventListener('popstate', function () {
-            cleanupLoading();
-        });
+        // 输入框实时验证
+        const nameInput = document.getElementById('unameinfo');
+        const phoneInput = document.getElementById('umoblie');
+        const emailInput = document.getElementById('uemail');
 
-        // 实时验证
-        document.getElementById('unameinfo')?.addEventListener('blur', function () {
-            if (this.value.trim()) nameError.style.display = 'none';
-        });
-        document.getElementById('umoblie')?.addEventListener('blur', function () {
-            if (this.value.trim() && isValidPhone(this.value.trim())) phoneError.style.display = 'none';
-        });
-        document.getElementById('uemail')?.addEventListener('blur', function () {
-            if (this.value.trim() && isValidEmail(this.value.trim())) emailError.style.display = 'none';
-        });
+        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>
 
