up

classiccase.html

@@ -187,26 +187,47 @@
             cardsContainer.innerHTML = html;
         }
 
+        function normalizeCategory(category) {
+            const validCategories = $('.service-tab-nav li').map(function() {
+                return $(this).data('category');
+            }).get();
+
+            return validCategories.includes(category) ? category : 'all';
+        }
+
+        function updateCategoryUrl(category) {
+            const url = new URL(window.location.href);
+
+            if (category === 'all') {
+                url.searchParams.delete('category');
+            } else {
+                url.searchParams.set('category', category);
+            }
+
+            window.history.replaceState({}, '', `${url.pathname}${url.search}${url.hash}`);
+        }
+
+        function switchCategory(category) {
+            const nextCategory = normalizeCategory(category);
+
+            $('.service-tab-nav li').removeClass('current');
+            $(`.service-tab-nav li[data-category="${nextCategory}"]`).addClass('current');
+
+            renderCards(nextCategory);
+            updateCategoryUrl(nextCategory);
+        }
+
         // Tab点击事件处理
         $(document).ready(function() {
-            // 初始化: 渲染全部卡片
-            renderCards('all');
+            const initialCategory = normalizeCategory(new URLSearchParams(window.location.search).get('category'));
+
+            // 初始化: 根据 URL 参数渲染对应卡片
+            switchCategory(initialCategory);
 
             // Tab点击事件
             $('.service-tab-nav li').on('click', function(e) {
                 e.preventDefault();
-
-                // 移除所有当前激活状态
-                $('.service-tab-nav li').removeClass('current');
-
-                // 添加当前激活状态
-                $(this).addClass('current');
-
-                // 获取分类
-                const category = $(this).data('category');
-
-                // 渲染对应的卡片
-                renderCards(category);
+                switchCategory($(this).data('category'));
             });
         });
     </script>