时间戳

首页 > 解决方案 > 如何通过 JavaScript 将我的操作存储在 cookie 中？

javascript - 如何通过 JavaScript 将我的操作存储在 cookie 中？

问题描述

我目前有一个复选框。我想实现一个方法，如下所述~

当用户点击复选框并变为红色背景状态时，可以使用 javascript 将此操作存储在 cookie 中。网页刷新的时候，红色背景状态还是Exist，要怎么写才能实现呢？

label input {
  display: none;
}
label i {
  display: block;
  width: 10px;
  height: 10px;
  border: 1px solid;
  background: red;
}
label input:checked ~ i {
  display: block;
  background-image: url("https://img.magiclen.org/albums/webpage-icon-font/shut-003.png");
  background-size: cover;
}
<label>
  <input type="checkbox">
  <i></i>
</label>

例子

标签： javascriptcookies

解决方案

您可以使用 Javascript 浏览器 DOM 设置 cookie：

document.cookie = "username=John Doe; expires=Thu, 18 Dec 2013 12:00:00 UTC";

这个例子取自 w3schools^^ https://www.w3schools.com/js/js_cookies.asp

从这里，你可以制作一个像document.cookie = "background_state = 1; expires=..."

然后在您的代码中，您可以简单地执行以下操作：

function getCookie(name) {
  const value = `; ${document.cookie}`;
  const parts = value.split(`; ${name}=`);
  if (parts.length === 2) return parts.pop().split(';').shift();
}

学分：按名称获取 cookie

从这里你可以做一些事情：（在你的代码的开头）

if(getCookie(background_state) //<-- this is referring to the value (if it's 1 its true, if 0 it's false) ){DOM.edit.css.here... };

推荐阅读