仅显示一次 jquery 弹出窗口

Question

我有一个用户必须登录的网站，一旦完成，他们就会被定向到一个新页面，并出现一个弹出框。显示弹出框没有问题，但是如果您一遍又一遍地刷新页面，则会出现弹出框。我希望它仅在他们登录后显示，并且只要他们从不注销，就永远不会再显示。这意味着如果他们重新刷新页面或类似的东西，弹出窗口将不会再次出现。是否有某种插件或简单的代码（我是 Jquery 的初学者）？

<div id="popup-image-back">
    <div class="popup-textbox">
        <div class="textbox-title">WE’VE HAD A MAKEOVER!</div>
        <div class="textbox-p">With fewer restrictions, more destinations and even better rewards you can start saving more money!</div>
    </div>
    <img class="new-popup-xclose" src="images/close-x-dark.png" />
</div>
<div id="back-wrapper"></div>

JavaScript

$(document).ready(function () {
    $('#back-wrapper').fadeIn(1000, function () {
        $('#popup-image-back').fadeIn(1000);
    });
    $(".new-popup-xclose").click(function () {
        $('#popup-image-back').fadeOut(1000);
        $('#back-wrapper').fadeOut(1000);
    });
});

Answer 1

虽然这个线程可能很古老，但我想给出一个 OP 可以使用的答案。通过使用 Cookie，您可以将页面设置为仅显示一次。由于大多数浏览器都支持 cookie，因此这比使用当前浏览器拥有的内部存储引擎更可靠。

$(document).ready(function(){
    // test for cookie here
    if ($.cookie('test_status') != '1') {
        //show popup here
        window.open('YOUR POPUP URL HERE','windowtest','toolbar=0,status=0,width=500,height=500');
        // set cookie here if not previous set
        var date = new Date();
        var minutes = 30;
        date.setTime(date.getTime() + (minutes * 60 * 1000));
        $.cookie('test_status', '1', {expires: date});
   }
});

若要对此进行测试，请确保在每次刷新之间清除 Cookie。

Answer 2

您可以使用localstorage来执行此操作：

if (localStorage.getItem("iswrpdivloaded") === null) {
  $('#back-wrapper').fadeIn(1000,function(){
   $('#popup-image-back').fadeIn(1000);
});
localStorage.setItem('iswrpdivloaded', 1);
}

Answer 3

您可以将其用于一次性弹出窗口。

$(window).load(function(){
        $('.popUp').show();
        $('.close').click(function(){
            $('.popUp').slideUp();
        });
        setTimeout('$(".popUp").fadeOut()', 10000);
    });