jQuery会话弹窗问题：实现单会话10秒后弹出且关闭后全站不显示

Hey there! Let's get this form popup working exactly as you need it. Your current code has a couple of gaps that are preventing it from meeting your requirements, so here's a polished solution with breakdowns of each part.

Core Requirements Recap #

First, let's make sure we're aligned on what you need:

• Popup shows 10 seconds after page load
• If the user hasn't closed the popup yet, it should still trigger when they navigate to other pages on your site
• Once the user closes the popup, it should never show again on any page

Revised jQuery Code #

$(document).ready(function() {
    // Check if user has ever closed the popup (persists across browser sessions)
    const hasClosedPopup = localStorage.getItem('popupClosed');

    if (!hasClosedPopup) {
        // Wait 10 seconds, then show the popup
        setTimeout(function() {
            $('.verif').fadeIn('fast');
        }, 10000); // 10000ms = 10 seconds
    }

    // Handle popup close action (update selector to match your close button)
    $('.close-verif').on('click', function() {
        $('.verif').fadeOut('fast');
        // Save the "closed" state permanently
        localStorage.setItem('popupClosed', 'true');
    });
});

What This Fixes & How It Works #

Let's walk through the improvements over your original code:

1. Fixed the timer: Your original code used 1000 (1 second) instead of 10000 (10 seconds) — that's adjusted now to match your requirement.
2. Permanent close tracking: We use localStorage to save when the user closes the popup. Unlike sessionStorage, this data stays even after the user closes their browser, so the popup never comes back once closed.
3. No forced state reset: Your original code set sessionStorage.setItem('firstVisit', '1') immediately on page load, which meant the popup would trigger every single time the page refreshed. Now we only trigger the popup if the user hasn't closed it before.

Optional: Session-Only One-Time Popup #

If you actually wanted the popup to show once per browser session (even if the user didn't close it), instead of on every page load, here's a variation using sessionStorage alongside localStorage:

$(document).ready(function() {
    const hasClosedPopup = localStorage.getItem('popupClosed');
    const hasSeenPopupThisSession = sessionStorage.getItem('popupSeen');

    // Only show if user hasn't closed it AND hasn't seen it in this session
    if (!hasClosedPopup && !hasSeenPopupThisSession) {
        setTimeout(function() {
            $('.verif').fadeIn('fast');
            // Mark that the popup was shown in this session
            sessionStorage.setItem('popupSeen', 'true');
        }, 10000);
    }

    $('.close-verif').on('click', function() {
        $('.verif').fadeOut('fast');
        localStorage.setItem('popupClosed', 'true');
    });
});

This version will show the popup once per browser session (until the user closes the browser) — but if the user closes the popup, it still stays gone forever.

内容的提问来源于stack exchange，提问作者Jason Sprague