Question

我是Javascript的新手，我有一个用于html表的Javascript，用户可以编辑它来显示或隐藏html表中的列。脚本运行正常。但问题是当页面刷新时它会显示html表中的所有列。它不记得最后的设置。

我希望能够存储脚本中最后一个操作的设置，因此在刷新或加载页面时，它会记住上次设置。我不知道如何实现这一点，如果你能告诉我该怎么做，我将不胜感激？

这是Javascript：

请参阅jsfiddle https://jsfiddle.net/b9chris/HvA4s/

中的工作示例

<script>
$(document).ready(function(){

$('#edit').click(function() {
    var headers = $('#table th').map(function() {
        var th =  $(this);
        return {
            text: th.text(),
            shown: th.css('display') != 'none'
        };
    });

    var h = ['<div id=tableEditor><button id=done>Done</button><table><thead><tr>'];
    $.each(headers, function() {
        h.push('<th><input type=checkbox',
               (this.shown ? ' checked ' : ' '),
               '/> ',
               this.text,
               '</th>');
    });
    h.push('</tr></thead></table></div>');
    $('body').append(h.join(''));

    $('#done').click(function() {
        var showHeaders = $('#tableEditor input').map(function() { return this.checked; });
        $.each(showHeaders, function(i, show) {
            var cssIndex = i + 1;
            var tags = $('#table th:nth-child(' + cssIndex + '), #table td:nth-child(' + cssIndex + ')');
            if (show)
                tags.show();
            else
                tags.hide();
        });

        $('#tableEditor').remove();
        return false;
    });

    return false;
});
});
</script>

Answer 1

用javascript编写cookie：

document.cookie = "username=John Doe";

你可以用你能想到的任何名字替换用户名，=后面的所有内容当然是你的价值。

要阅读您的cookie，您可以使用W3Scools中的此功能：

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 "";
}

如果您想获取用户名

，请致电getCookie("username")

Answer 2

您还可以将设置存储到浏览器本地存储：请参阅official documentation。

基本上，当你的脚本加载时，只需查看会话存储以检索所需的设置;每当用户编辑表时，将其更改放在存储中。它非常简单，并且不像操纵cookie那么重。

在Javascript Cookie中存储设置

2 个答案: