fixed 打赏卡片逻辑修复

themes/Ying/assets/js/modules/reward.js

@@ -9,6 +9,24 @@
 
         if (!btn || !modal) return;
 
+        // Global Click Handler
+        // We attach this to document only when modal is open to handle "click anywhere outside content"
+        // This is more robust than attaching to the modal container, which might have size/z-index issues.
+        
+        const handleGlobalClick = (e) => {
+            const activeModal = document.getElementById('reward-modal');
+            if (!activeModal || !activeModal.classList.contains('show')) return;
+            
+            // If click is inside the content, ignore
+            if (e.target.closest('.reward-content')) return;
+            
+            // If click is on the open button, ignore (it has its own handler, or we might double-toggle)
+            if (e.target.closest('#reward-btn')) return;
+
+            // Otherwise, close it
+            hideModal();
+        };
+
         // Helper to show modal
         const showModal = (e) => {
             if(e) {
@@ -17,12 +35,18 @@
             }
             modal.classList.add('show');
             document.body.style.overflow = 'hidden'; // Prevent scrolling
+            
+            // Attach global click listener with a slight delay to avoid current click triggering it
+            setTimeout(() => {
+                document.addEventListener('click', handleGlobalClick);
+            }, 10);
         };
 
         // Helper to hide modal
         const hideModal = () => {
             modal.classList.remove('show');
             document.body.style.overflow = '';
+            document.removeEventListener('click', handleGlobalClick);
         };
 
         // Button click
@@ -30,27 +54,55 @@
 
         // Close button click
         if (close) {
-            close.addEventListener('click', hideModal);
-        }
-
-        // Click outside modal content
-        modal.addEventListener('click', (e) => {
-            if (e.target === modal) {
+            close.addEventListener('click', (e) => {
+                e.stopPropagation(); // Prevent bubbling to global handler (though redundant as handler checks)
                 hideModal();
-            }
-        });
+            });
+        }
+        
+        // Remove old direct listeners if any (cleaner approach replaces them)
 
         // Escape key to close
         if (!window.rewardKeyHandlerAttached) {
-            document.addEventListener('keydown', function(e) {
+            window.rewardKeyHandler = function(e) {
                 const activeModal = document.getElementById('reward-modal');
                 if (e.key === 'Escape' && activeModal && activeModal.classList.contains('show')) {
-                    activeModal.classList.remove('show');
-                    document.body.style.overflow = '';
+                    hideModal(); // Use the same hide function to clean up listeners
                 }
-            });
+            };
+            document.addEventListener('keydown', window.rewardKeyHandler);
             window.rewardKeyHandlerAttached = true;
         }
+        
+        // Expose hideModal for destroy function if needed? 
+        // We can just rely on the fact that destroyReward queries DOM.
+        // But we need to make sure destroyReward removes the global listener too.
+        // Since handleGlobalClick is local scope, we need a way to reference it or just define it outside?
+        // Or better: make handleGlobalClick a named function available to destroyReward via a shared scope or window.
+        // Let's attach it to window for safety in this module pattern.
+        window.rewardGlobalClickHandler = handleGlobalClick;
+    }
+
+    function destroyReward() {
+        // Cleanup keydown listener
+        if (window.rewardKeyHandlerAttached && window.rewardKeyHandler) {
+            document.removeEventListener('keydown', window.rewardKeyHandler);
+            window.rewardKeyHandlerAttached = false;
+            window.rewardKeyHandler = null;
+        }
+        
+        // Cleanup global click listener
+        if (window.rewardGlobalClickHandler) {
+            document.removeEventListener('click', window.rewardGlobalClickHandler);
+            window.rewardGlobalClickHandler = null;
+        }
+        
+        // Hide modal if open (restore body scroll)
+        const modal = document.getElementById('reward-modal');
+        if (modal && modal.classList.contains('show')) {
+            modal.classList.remove('show');
+            document.body.style.overflow = '';
+        }
     }
 
     // Initialize on load
@@ -58,7 +110,11 @@
 
     // Initialize on Pjax complete
     document.addEventListener('pjax:complete', initReward);
+
+    // Destroy on Pjax send
+    document.addEventListener('pjax:send', destroyReward);
     
     // Export
     window.initReward = initReward;
+    window.destroyReward = destroyReward;
 })();