如何为基于Cookie的弹窗添加3秒延迟？

安全阿岳

2026-8-8

解决弹窗延迟显示问题

你的代码无效的原因是使用了错误的语法：$(document).setTimeout 不是合法调用方式，setTimeout 是全局函数，应直接调用。同时你移除了 $(document).ready 包裹，这会导致代码可能在DOM元素加载完成前执行，无法找到 .popup-overlay-b 元素。

正确实现方案

方案1：保持原逻辑（弹窗显示时设置Cookie）

该方案和你原代码逻辑一致，仅当弹窗实际显示时才设置Cookie。但如果用户在延迟期间刷新页面，会再次触发弹窗调度：

$(document).ready(function(){
    if (!Cookies.get('alert')) { 
        setTimeout(function(){
            $('.popup-overlay-b').show(); 
            Cookies.set('alert', true, { expires: 1 });
        }, 3000); // 3秒延迟
    }
});

方案2：立即设置Cookie（避免重复调度）

该方案会在页面加载时立即设置Cookie，即使弹窗还未显示，用户刷新页面也不会重复触发弹窗：

$(document).ready(function(){
    if (!Cookies.get('alert')) { 
        Cookies.set('alert', true, { expires: 1 });
        setTimeout(function(){
            $('.popup-overlay-b').show(); 
        }, 3000); // 3秒延迟
    }
});