关闭div后设置cookie

时间:2017-07-12 15:46:00

标签: javascript html

这是我的HTML:

 <span class="boxclose" id='close'>X</span>

这是我的剧本:

<script type="text/javascript">
window.onload = function(){
    document.getElementById('close').onclick = function(){
        this.parentNode.parentNode.parentNode
        .removeChild(this.parentNode.parentNode);
        return false;
    };
};
</script>

一切正常,但我不知道如何更新脚本以设置一个cookie来记住,一旦它被关闭。任何帮助将不胜感激,谢谢

1 个答案:

答案 0 :(得分:0)

保存和阅读Cookie

如果您想以简单的方式阅读和保存Cookie,可以使用W3Schools中的以下两项功能。如果单击close元素,我会创建一个名为“closed”的cookie,我将其设置为“True”。在页面上加载cookie“关闭”只是检查它是否确实已被点击。

function getCookie(cname) {
  var name = cname + "=";
  var decodedCookie = decodeURIComponent(document.cookie);
  var ca = decodedCookie.split(';');
  for (var i = 0; i < ca.length; i++) {
    var c = ca[i];
    while (c.charAt(0) == ' ') {
      c = c.substring(1);
    }
    if (c.indexOf(name) == 0) {
      return c.substring(name.length, c.length);
    }
  }
  return "";
}

function setCookie(cname, cvalue, exdays) {
  var d = new Date();
  d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
  var expires = "expires=" + d.toUTCString();
  document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
}

window.onload = function() {
  if (getCookie("closed") == "True") {
    document.getElementById('close').parentNode.parentNode.parentNode.removeChild(document.getElementById('close').parentNode.parentNode);
  } else {
    document.getElementById('close').onclick = function() {
      setCookie("closed", "True", 42);
      this.parentNode.parentNode.parentNode.removeChild(this.parentNode.parentNode);
      return false;
    };
  }
};

有关Cookie click here的更多信息。

保存在内部并从localStorage中读取

这是 localStorage 的一个示例,因为localStorage项目几乎就像一个cookie,因此您可能会感兴趣。

点击我存储的关闭元素后,使用localStorage.setItem("closed","True");在localStorage中单击它。现在要检查访问者在之前访问时是否已关闭该元素等,您可以使用localStorage.getitem("closed")返回“True”(在本例中)并将其与字符串“True”进行比较。

window.onload = function() {
  if (typeof(Storage) !== "undefined") {
    if (localStorage.getItem("closed") == "True") {
      document.getElementById('close').parentNode.parentNode.parentNode.removeChild(document.getElementById('close').parentNode.parentNode);
    }
    document.getElementById('close').onclick = function() {
      this.parentNode.parentNode.parentNode.removeChild(this.parentNode.parentNode);
      localStorage.setItem("closed", "True");
      return false;
    };
  } else {
    alert("Your browser does not support localStorage");
  }
};

Click here是一个有效的jsfiddle。 有关localStorage的更多信息,我建议W3Schools