jQuery Cookie hide/show div

Question

我想使用jQuery Cookie设置一个cookie，这样就会为新访问者显示一个提醒，当你点击“关闭”按钮时，它将设置一个cookie并阻止提醒div显示。我也想让cookie在24小时后过期。

我已经玩了一些代码，并得到它的工作，但是，我现在的方式，警报div默认显示，只有隐藏一次，你点击关闭。这很好，但是当cookie存在时，该警报在被隐藏之前显示一秒钟。

我该如何修改下面的代码，以便默认情况下可以隐藏div，如果cookie不存在，它会显示出来，但如果他们点击关闭按钮，它将生成一个cookie并隐藏提醒24小时？

if ($.cookie('alert')) $('.alert-box').hide(); 
else { 
    $(".close").click(function() { 
     $(".alert-box").slideUp("slow", function() { }); 
     $.cookie('alert', true); 
    }); 
} 

Answer 1

您可以在默认情况下使用CSS隐藏警告框，并使用JavaScript来显示它的时候，因为没有Cookie：

CSS：

.alert-box { 
    display: none; 
} 

的JavaScript：

// if no cookie 
if (!$.cookie('alert')) { 
    $(".alert-box").show(); 
    $(".close").click(function() { 
     $(".alert-box").slideUp("slow"); 
     // set the cookie for 24 hours 
     var date = new Date(); 
     date.setTime(date.getTime() + 24 * 60 * 60 * 1000); 
     $.cookie('alert', true, { expires: date }); 
    }); 
}