部分跳转功能实现

index.html

@@ -89,32 +89,32 @@
           
           <!-- 首页文字 -->
           <div>
-            <a class="relative font-medium text-[#333333] hover:text-[#FFA300] cursor-pointer pb-4">
+            <a class="relative font-medium text-[#333333] hover:text-[#FFA300] cursor-pointer pb-4" id="goHome">
               首页
             </a>
             <span class="arrow-box"></span>
           </div>
           <!-- 下拉菜单 -->
           <div class="home-dropdown">
-            <a class="dropdown-item">
+            <a class="dropdown-item" id="teSeGongNeng">
               特色功能 
             </a>
-            <a class="dropdown-item">
+            <a class="dropdown-item" id="goRegister2">
               DeepChart下载
             </a>
-            <a class="dropdown-item">
-              夺宝岛下载 
+            <a class="dropdown-item" id="duoBaoQiBing">
+              夺宝奇兵下载 
             </a>
-            <a class="dropdown-item">
+            <a class="dropdown-item" id="yingZaiMeiGu">
               赢在美股专题课 
             </a>
           </div>
 
         </div>
         <span class="text-gray-300">|</span>
-        <a class="text-gray-700 hover:text-orange-500 font-medium">立即注册</a>
+        <a class="text-gray-700 hover:text-orange-500 font-medium" id="goRegister1">立即注册</a>
         <span class="text-gray-300">|</span>
-        <a class="text-gray-700 hover:text-orange-500 font-medium">操作指南</a>
+        <a class="text-gray-700 hover:text-orange-500 font-medium" id="goCaoZuo1">操作指南</a>
         <span class="text-gray-300">|</span>
         <a class=" text-white px-6 py-2 rounded-full font-bold  hover:shadow-lg transition-all"  style="background: #FFA300;">
           联系我们
@@ -136,7 +136,7 @@
           </div>
 
           <div class="grid grid-cols-1 md:grid-cols-3 gap-8">
-            <div class="animate-fade-in delay-100">
+            <div class="animate-fade-in delay-100" id="DeepChartZone2">
               <div
                 class="p-8 rounded-2xl shadow-lg
                       bg-[#FBEFEF]
@@ -152,7 +152,7 @@
               </div>
             </div>
 
-            <div class="animate-fade-in delay-200">
+            <div class="animate-fade-in delay-200" id="DuoBaoQiBingZone2">
               <div
                 class="p-8 rounded-2xl shadow-lg
                       bg-[#F1F6FF]
@@ -168,7 +168,7 @@
               </div>
             </div>
 
-            <div class="animate-fade-in delay-300">
+            <div class="animate-fade-in delay-300" id="YingZaiMeiGUZone2">
               <div
                 class="p-8 rounded-2xl shadow-lg
                       bg-[#FBF6EF]
@@ -189,7 +189,7 @@
       <!-- 产品宣传区域 -->
       <section id="promotions" class="py-20 px-4 bg-gray-50">
         <div class="container mx-auto max-w-6xl">
-          <div class="mb-6 text-center">
+          <div class="mb-6 text-center" id="DeepChartZone">
             <h4 class="text-3xl md:text-4xl font-semibold text-gray-800">
               教育精英化 · 武器AI化
             </h4>
@@ -230,7 +230,7 @@
                   </span>
                 </li>
               </ul>
-              <a href="#register" 
+              <a href="javascript:void(0)" id="goRegister" 
                 class="self-center inline-block text-white text-lg font-bold px-12 py-3 rounded-full  transition-all duration-300 hover:-translate-y-[3px] hover:shadow-md 
                         bg-[linear-gradient(90deg,#FFAC19_0%,#FFA300_100%)]">
                 立即注册
@@ -239,7 +239,7 @@
           </div>
 
           <!-- 宣传项 2 - AI预测大模型 -->
-          <div class="mb-6 text-center">
+          <div class="mb-6 text-center" id="DuoBaoQiBingZone">
             <h4 class="text-3xl md:text-4xl font-semibold text-gray-800">
               夺宝奇兵下载体验
             </h4>
@@ -293,7 +293,7 @@
             </div>
           </div>
           <!-- 宣传项 4 - 专题讲座 -->
-          <div class="mb-6 text-center">
+          <div class="mb-6 text-center" id="YingZaiMeiGUZone">
             <h4 class="text-3xl md:text-4xl font-semibold text-gray-800">
               赢家粉内部专题讲座
             </h4>
@@ -722,7 +722,7 @@
     </section>
     <section
       id="page-register-success"
-      class="page relative text-white overflow-hidden font-sans min-h-screen flex flex-col "
+      class="page relative text-white overflow-hidden font-sans min-h-screen flex flex-col dohidden"
     >
       <div class="absolute inset-0 z-0">
         <img
@@ -1345,6 +1345,166 @@
       document.getElementById('loadingOverlay').style.display = 'none';
     });
 
+    const goHomeBtn = document.getElementById('goHome');
+    if (goHomeBtn) {
+      goHomeBtn.addEventListener('click', (e) => {
+        e.preventDefault(); // 阻止默认跳转
+        document.getElementById('page-home').classList.remove('dohidden');
+        document.getElementById('page-register').classList.add('dohidden');
+        document.getElementById('page-register-success').classList.add('dohidden');
+        document.getElementById('page-guide').classList.add('dohidden');
+        window.scrollTo(0, 0); // 切换后滚动到顶部
+      });
+    }
+    // 绑定立即注册按钮点击事件 - 切换页面
+    const goRegisterBtn = document.getElementById('goRegister');
+    if (goRegisterBtn) {
+      goRegisterBtn.addEventListener('click', (e) => {
+        e.preventDefault(); // 阻止默认跳转
+        document.getElementById('page-home').classList.add('dohidden');
+        document.getElementById('page-register').classList.remove('dohidden');
+        document.getElementById('page-register-success').classList.add('dohidden');
+        document.getElementById('page-guide').classList.add('dohidden');
+        window.scrollTo(0, 0); // 切换后滚动到顶部
+      });
+    }
+    const goRegisterBtn2 = document.getElementById('goRegister2');
+    if (goRegisterBtn2) {
+      goRegisterBtn2.addEventListener('click', (e) => {
+        // 禁用平滑滚动
+      document.documentElement.style.scrollBehavior = 'auto';
+      
+      const promotionsBtn = document.getElementById('DeepChartZone');
+        const headerHeight = document.querySelector('header').offsetHeight;
+        const registerPosition = promotionsBtn.offsetTop - headerHeight - 20;
+
+        // 立即设置滚动位置
+        window.scrollTo(0, registerPosition);
+      // 恢复平滑滚动
+      setTimeout(() => {
+        document.documentElement.style.scrollBehavior = 'smooth';
+      }, 100);
+      });
+    }
+    const duoBaoQiBingBtn = document.getElementById('duoBaoQiBing');
+    if (duoBaoQiBingBtn) {
+      duoBaoQiBingBtn.addEventListener('click', (e) => {
+        // 禁用平滑滚动
+      document.documentElement.style.scrollBehavior = 'auto';
+      
+      const promotionsBtn = document.getElementById('DuoBaoQiBingZone');
+        const headerHeight = document.querySelector('header').offsetHeight;
+        const registerPosition = promotionsBtn.offsetTop - headerHeight - 20;
+
+        // 立即设置滚动位置
+        window.scrollTo(0, registerPosition);
+      // 恢复平滑滚动
+      setTimeout(() => {
+        document.documentElement.style.scrollBehavior = 'smooth';
+      }, 100);
+      });
+    }
+    const yingZaiMeiGuBtn = document.getElementById('yingZaiMeiGu');
+    if (yingZaiMeiGuBtn) {
+      yingZaiMeiGuBtn.addEventListener('click', (e) => {
+        // 禁用平滑滚动
+      document.documentElement.style.scrollBehavior = 'auto';
+      
+      const promotionsBtn = document.getElementById('YingZaiMeiGUZone');
+        const headerHeight = document.querySelector('header').offsetHeight;
+        const registerPosition = promotionsBtn.offsetTop - headerHeight - 20;
+
+        // 立即设置滚动位置
+        window.scrollTo(0, registerPosition);
+      // 恢复平滑滚动
+      setTimeout(() => {
+        document.documentElement.style.scrollBehavior = 'smooth';
+      }, 100);
+      });
+    }
+    const teSeGongNengBtn = document.getElementById('teSeGongNeng');
+    if (teSeGongNengBtn) {
+      teSeGongNengBtn.addEventListener('click', (e) => {
+
+      window.scrollTo(0, 0);
+      });
+    }
+    const goRegisterBtn1 = document.getElementById('goRegister1');
+    if (goRegisterBtn1) {
+      goRegisterBtn1.addEventListener('click', (e) => {
+        e.preventDefault(); // 阻止默认跳转
+        document.getElementById('page-home').classList.add('dohidden');
+        document.getElementById('page-register').classList.remove('dohidden');
+        document.getElementById('page-register-success').classList.add('dohidden');
+        document.getElementById('page-guide').classList.add('dohidden');
+        window.scrollTo(0, 0); // 切换后滚动到顶部
+      });
+    }
+    const goCaoZuoBtn1 = document.getElementById('goCaoZuo1');
+    if (goCaoZuoBtn1) {
+      goCaoZuoBtn1.addEventListener('click', (e) => {
+        e.preventDefault(); // 阻止默认跳转
+        document.getElementById('page-home').classList.add('dohidden');
+        document.getElementById('page-register').classList.add('dohidden');
+        document.getElementById('page-register-success').classList.add('dohidden');
+        document.getElementById('page-guide').classList.remove('dohidden');
+        window.scrollTo(0, 0); // 切换后滚动到顶部
+      });
+    }
+    const goRegisterBtn3 = document.getElementById('DeepChartZone2');
+    if (goRegisterBtn3) {
+      goRegisterBtn3.addEventListener('click', (e) => {
+        // 禁用平滑滚动
+      document.documentElement.style.scrollBehavior = 'auto';
+      
+      const promotionsBtn = document.getElementById('DeepChartZone');
+        const headerHeight = document.querySelector('header').offsetHeight;
+        const registerPosition = promotionsBtn.offsetTop - headerHeight - 20;
+
+        // 立即设置滚动位置
+        window.scrollTo(0, registerPosition);
+      // 恢复平滑滚动
+      setTimeout(() => {
+        document.documentElement.style.scrollBehavior = 'smooth';
+      }, 100);
+      });
+    }
+    const duoBaoQiBingBtn2 = document.getElementById('DuoBaoQiBingZone2');
+    if (duoBaoQiBingBtn2) {
+      duoBaoQiBingBtn2.addEventListener('click', (e) => {
+        // 禁用平滑滚动
+      document.documentElement.style.scrollBehavior = 'auto';
+      
+      const promotionsBtn = document.getElementById('DuoBaoQiBingZone');
+        const headerHeight = document.querySelector('header').offsetHeight;
+        const registerPosition = promotionsBtn.offsetTop - headerHeight - 20;
+
+        // 立即设置滚动位置
+        window.scrollTo(0, registerPosition);
+      // 恢复平滑滚动
+      setTimeout(() => {
+        document.documentElement.style.scrollBehavior = 'smooth';
+      }, 100);
+      });
+    }
+    const yingZaiMeiGuBtn2 = document.getElementById('YingZaiMeiGUZone2');
+    if (yingZaiMeiGuBtn2) {
+      yingZaiMeiGuBtn2.addEventListener('click', (e) => {
+        // 禁用平滑滚动
+      document.documentElement.style.scrollBehavior = 'auto';
+      
+      const promotionsBtn = document.getElementById('YingZaiMeiGUZone');
+        const headerHeight = document.querySelector('header').offsetHeight;
+        const registerPosition = promotionsBtn.offsetTop - headerHeight - 20;
+
+        // 立即设置滚动位置
+        window.scrollTo(0, registerPosition);
+      // 恢复平滑滚动
+      setTimeout(() => {
+        document.documentElement.style.scrollBehavior = 'smooth';
+      }, 100);
+      });
+    }
     // 绑定表单提交事件
     registrationForm.addEventListener('submit', handleFormSubmit);
     registrationForm1.addEventListener('submit', handleDCFormSubmit);