javascript - 保存复选框

Question

我构建了一个带有复选框的动态阅读图表，以便人们检查他们阅读的章节。

我怎样才能保存选中的内容，以便下次他们重新打开或重新加载页面时，选中的内容不会被取消选中？

这是我在 HTML 文档中设置复选框的方式:

      <input type ='checkbox' class = 'check'>Chapter 1
      <input type ='checkbox' class = 'check'>Chapter 2 
      <input type ='checkbox' class = 'check'>Chapter 3
      <input type ='checkbox' class = 'check'>Chapter 4
      <input type ='checkbox' class = 'check'>Chapter 5
      <input type ='checkbox' class = 'check'>Chapter 6
      <input type ='checkbox' class = 'check'>Chapter 7

Answer 1

您可以在 JavaScript 中使用 localStorage 方法:

let checkedChapters = [...];
localStorage.setItem('completedChapters', JSON.strignify(checkedChapters));

之后您可以在应用程序中获取保存的数据。

let checkedChapters = JSON.parse(localStorage.getItem('completedChapters'));

我们使用 JSON.parse() 和 JSON.stringify() 因为所有保存的项目都是 'string' 类型