24小时内仅点击一次,显示提示框

Display info box when user clicks only once in 24h

本文关键字:一次 显示 提示 24小时      更新时间:2023-09-26

我想显示一个信息框,当用户点击我的网站的任何地方。它的工作非常好,但信息框应该只在24小时内显示一次。所以我需要设置一个cookie,但不幸的是我不知道如何设置。

<script>    
    document.onclick = function (event) {
        alert("Some info box");
    };    
</script

您可以使用document.cookie。这里有一篇关于它的文章:https://developer.mozilla.org/en-US/docs/Web/API/Document/cookie。
出于您的目的,您需要这样的内容:

<script>

  document.onclick= function(event) {
  // Check if the cookie is set
  if (document.cookie.indexOf("alert=true") == -1) {
      alert("Some info box");
      // Set a cookie to indicate the alert has been displayed.
      // Expiration time is 60 seconds * 60 minutes * 24 hours
      document.cookie = "alert=true; max-age=" + 60 * 60 * 24;
  }

    };
  </script>

你有几件事要做。

  1. 首先,使用document.cookie设置一个cookie,它将包含从现在起24小时的时间戳。这应该在用户第一次点击网页时完成。此时可以显示信息框。
  2. 然后,在此之后的每一次点击,你应该检查now的时间是否超过了cookie的值(这意味着简单地检查自cookie设置以来是否已经过去了24小时)。
  3. 仅当超过时,显示信息框,并将cookie值从now更新为24小时。

我创建了一个小提琴来演示