每个用户仅显示一次弹出窗口[重复]答案

【问题标题】：Display a popout only once per user [duplicate]每个用户仅显示一次弹出窗口[重复]
【发布时间】：2016-04-28 01:37:26
【问题描述】：

这个问题已经有了答案，但我仍然不确定它是如何工作的。

这是我的代码：

这是我的 JavaScript：

   <!--PopupScript-->
    <script>
      // you can use just jquery for this
      $(document).ready(function(){
         $('#overlay-back').fadeIn(500,function(){
            $('#popup').show();
         });

         $(".close-image").on('click', function() {
            $('#popup').hide();
            $('#overlay-back').fadeOut(500);
         });
      });
   </script>

这是 HTML：

     <!--Popup Content-->
    <div class="container-fluid">
    <div id="overlay-back"></div>
    <div id="popup">
    <img src="Assets/images/Deep_Close.png" class="close-image" />
    <form name="Mail_list" action="save.php" method="post">
    <h4>Subscription</h4>
    <br/>
        <div class="form-group">
          <label for="first_name">First Name: </label>
          <input type="text" name="first_name" id="first_name" size="25" placeholder="First Name" autofocus required />
        </div>
        <div class="form-group">
          <label for="last_name">Last Name: </label>
          <input type="text" name="last_name" id="last_name" size="25" placeholder="Last Name"  required />
        </div>
         <div class="form-group">
          <label for="email">User Email: </label>
          <input type="text" name="email" id="email" size="25" placeholder="Email"  required />
        </div>
        <br/><br/>
        <input type="submit" value="Submit Form">
        <input type="reset" value="Reset Form">         
      </form>
</div>
</div>

此解决方案非常适合我的需要。问题是我不希望每次有人导航到主页时都显示弹出窗口，我希望每个用户或会话只显示一次弹出窗口。我知道这可以通过使用“cookies”来实现，但我不知道如何将它合并到上面的 JavaScript 中。

任何帮助将不胜感激。谢谢你。

【问题讨论】：

使用会话存储而不是使用cookies
谢谢，会查一些相关的文档。
cookies / localstaroge / sessionstorage 是你的朋友 :)
在提出新问题之前考虑在谷歌上搜索。
google 总是我的去处，我找不到我正在寻找的示例，正如我在问题中所说，“这个问题已经有了答案，但我仍然不确定这个怎么运作。” @zzzzBov

标签： javascript jquery cookies

【解决方案1】：

您可以使用localStorage。

例子：

    $('#overlay-back').fadeIn(500,function(){
        if (localStorage.popupShown !== "true") {
          $('#popup').show();
          localStorage.popupShown = "true";
        }
     });

【讨论】：

【解决方案2】：

你可以试试

$(document).ready(function(){
         if (sessionStorage.count==0) {
         $('#overlay-back').fadeIn(500,function(){
            $('#popup').show();
            sessionStorage.count = 1;
         });
         }

         $(".close-image").on('click', function() {
            $('#popup').hide();
            $('#overlay-back').fadeOut(500);
         });
      });

【讨论】：