Question

function showhide() {
if( document.getElementById("hidethis").style.display=='none' ){
  document.getElementById("hidethis").style.display = 'table-row'; // set to table-row instead of an empty string
}else{
  document.getElementById("hidethis").style.display = 'none';
}
}

我有这个工作的javascript函数来隐藏表中的一行 - 比如这个

<tr id="hidethis" style="display:table-row;">

它工作正常，但我想使用cookie来记住用户选择的选项。我无法弄清楚如何正确设置cookie，一些建议将非常感激。

Answer 1

试试这个：

您需要将值存储在cookies中并在DOMContentLoaded事件广告中读取这些值，并相应地设置style

Reference用于创建和读取Cookie值

var createCookie = function(name, value, days) {
  var expires;
  if (days) {
    var date = new Date();
    date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
    expires = "; expires=" + date.toGMTString();
  } else {
    expires = "";
  }
  document.cookie = name + "=" + value + expires + "; path=/";
};

function getCookie(c_name) {
  if (document.cookie.length > 0) {
    c_start = document.cookie.indexOf(c_name + "=");
    if (c_start != -1) {
      c_start = c_start + c_name.length + 1;
      c_end = document.cookie.indexOf(";", c_start);
      if (c_end == -1) {
        c_end = document.cookie.length;
      }
      return unescape(document.cookie.substring(c_start, c_end));
    }
  }
  return "";
}

document.addEventListener('DOMContentLoaded', function() {
  var cookieVal = getCookie('display');
  if (cookieVal) {
    document.getElementById("hidethis").style.display = cookieVal;
  }
});

function showhide() {
  if (document.getElementById("hidethis").style.display == 'none') {
    document.getElementById("hidethis").style.display = 'table-row'; // set to table-row instead of an empty string
    createCookie('display', 'table-row', 365);
  } else {
    document.getElementById("hidethis").style.display = 'none';
    createCookie('display', 'none', 365);
  }
}

<table>
  <tr id="hidethis" style="display:table-row;">
</table>

显示隐藏javascript cookie

1 个答案: