【问题标题】:How to hide a div for 24 hours with a cookie如何使用 cookie 将 div 隐藏 24 小时
【发布时间】:2018-12-07 13:38:23
【问题描述】:

我需要将此div 隐藏 24 小时。 put 不工作。

我想要一个简单的 JavaScript 代码,允许我在点击预定的时间后隐藏某个 div 元素。
为了提供更多信息,我在主页加载时出现了一个建议框。我想要的是,当单击 div 关闭按钮时,它会设置一个 cookie 以保持框 div 关闭 24 小时(1 天)。
简单来说,当按下div关闭按钮时,box div会隐藏24小时。

注意:我有一个 javascript 代码,它允许关闭按钮关闭框,但它会重新加载每次刷新。
Link to the project's file (编辑评论:从不受信任的网站下载文件是不安全的,还是等作者用代码编辑问题吧。)

【问题讨论】:

  • 请在您的问题中插入您的代码!
  • 欢迎来到 SO。请使用tourhelp centre 来查看how to ask a good question。如果您不提供任何代码,我们将无法为您提供帮助 - 请参阅如何创建 minimal reproducible example - 您不能只粘贴指向您网站的链接:Something on my website doesn't work, can I just paste a link to it?
  • 您需要在后端坚持它以使其真正具有抵抗力。如果它不是那么重要,那么通过 cookie 或本地存储以存储用户名、点击时间和隐藏内容的方式保存它,一些标识符。然后你的应用程序需要加载它并检查当前登录的用户它应该显示什么。如果计时器过期,则从“内存”中删除那些不应该再在那里清理的人。
  • Stackoverflow 上的一个好问题在问题正文中包含代码。没有链接到其他地方。这是因为链接将过期,然后问题和答案将对其他人没有价值。请在问题中输入代码(不是代码链接,也不是屏幕截图)。谢谢。
  • 嗨,欢迎来到 Stack Overflow。正如@StephenM 评论的那样,回答这个网站上的问题需要代码。上传文件不是一个好方法,因为它会过期,很少有人愿意冒险下载它。我已编辑您的问题以使其更易于理解,请对代码执行相同操作。

标签: javascript html cookies show-hide


【解决方案1】:

我注意到#splashscreen 默认设置为可见。您可以默认隐藏它并仅在 cookie 不存在时显示它。或者更简单地添加else statement 并在 cookie 存在时将其隐藏。请更改您的JS代码的第一个if statement如下。

// If the 'hide cookie is not set we show the message
  if (!readCookie('hide')) {
    $('#splashscreen').show();
  } else {
    $('#splashscreen').hide();
  }

【讨论】:

    【解决方案2】:

    谢谢所有正确的代码

    $(document).ready(function() {
    
      // If the 'hide cookie is not set we show the message
      if (!readCookie('hide')) {
        $('#applink').show();
      }else {
        $('#applink').hide();
      }
    
      // Add the event that closes the popup and sets the cookie that tells us to
      // not show it again until one day has passed.
      $('#playstorclose').click(function() {
        $('#applink').hide();
        createCookie('hide', true, 1)
        return false;
      });
    
    });
    
    // ---
    // And some generic cookie logic
    // ---
    function createCookie(name,value,days) {
      if (days) {
        var date = new Date();
        date.setTime(date.getTime()+(days*24*60*60*1000));
        var expires = "; expires="+date.toGMTString();
      }
      else var expires = "";
      document.cookie = name+"="+value+expires+"; path=/";
    }
    
    function readCookie(name) {
      var nameEQ = name + "=";
      var ca = document.cookie.split(';');
      for(var i=0;i < ca.length;i++) {
        var c = ca[i];
        while (c.charAt(0)==' ') c = c.substring(1,c.length);
        if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
      }
      return null;
    }
    
    function eraseCookie(name) {
      createCookie(name,"",-1);
    }
    <div class="playstorapp" id="applink" style="text-align: center;margin: auto">
            <a id="playstorclose" href="JavaScript:void(0)">X</a>
            <a class="applink" href="https://play.google.com/store/apps/details?id=com.aradev.net&rdid=com.aradev.net" target="_blank">
                Download
            </a>
        </div>

    【讨论】:

      猜你喜欢
      • 2015-03-11
      • 1970-01-01
      • 1970-01-01
      • 2021-07-31
      • 2019-03-03
      • 2014-01-13
      • 1970-01-01
      • 1970-01-01
      • 2023-03-13
      相关资源
      最近更新 更多