jquery - 延迟弹出10秒，仅弹出一次

Question

您好，我正在使用 fancybox 内联弹出窗口来提醒 View 促销事件。我为此使用的代码是:

$(document).ready(function() {
  $("#various1").fancybox();
});

我该如何修改它，使其在 20 秒后自动弹出？但一旦关闭，就不会再弹出。

Answer 1

实际上，之前发布的解决方案在现实生活中都不起作用，为什么？因为该行:

$("#various1").fancybox();

不会触发 fancybox，它只是将 fancybox 绑定(bind)到选择器 #various1，但它仍然需要单击来触发模式/灯箱(不是弹出窗口)。顺便说一句，Gearóid 的解决方案无论如何都有语法错误。唯一真正的值(value)是他们建议使用 jQuery cookie plugin (旧网站)。

编辑:(2012 年 3 月 7 日)jQuery cookie 插件主页 moved here .

可行解决方案的步骤:

A) 在 jQuery 和 fancybox js 文件之后加载 jQuery cookie 插件(按照建议)

B)然后使用这个脚本:

<script type="text/javascript">
function openFancybox() {
    setTimeout( function() {$('#various1').trigger('click'); },20000);
}
$(document).ready(function() {
    var visited = $.cookie('visited');
    if (visited == 'yes') {
        return false;
    } else {
        openFancybox();
    }
    $.cookie('visited', 'yes', { expires: 7 });
    $('#various1').fancybox();
});
</script>

C) 你的 html 代码中仍然需要有某个地方(可能是隐藏的)

<a id="various1" href="path/target"></a>

或内联内容

<a id="various1" href="#target"></a>
<div style="display: none;">
 <div id="target">message to display in fancybox</div>
</div>

此外，如果您使用内联内容和 fancybox v1.3.x，请检查现有错误和解决方法 here

PS。 fancybox 不是一个弹出窗口，而是一个模态/灯箱 jQuery 插件，从 UI 角度来看，它是一个像 jGrowl 一样的非侵入式解决方案。