页面重新加载时保存选中的复选框[重复]答案

【问题标题】：save checked checkboxes when Page reloads [duplicate]页面重新加载时保存选中的复选框[重复]
【发布时间】：2020-03-11 14:05:47
【问题描述】：

对于我的搜索引擎，我使用带有复选框的表单设计了一个过滤器。提交这些时，过滤器功能可以正常工作（为此使用 Flask）。然而，当显示结果时，用作过滤器的复选框再次取消选中。我是否需要将信息保存在 localStorage 中，如何做到这一点？感谢您的帮助

这是我的复选框代码的一部分（我是 HTML/JS 的新手）：

 <form>                  
  <article class="card-group-item">                      
    <header class="card-header">                          
      <span class="title">Document Types </span>               
    </header>                     
      <div class="filter-content">
          <div class="card-body">
             <label class="form-check" >
                 <input class="form-check-input" type="checkbox" name="doctype" value="offer" id="offer">
                 <span class="form-check-label">Offer</span>
             </label> <!-- form-check.// -->
             <button type="submit" class="btn btn-secondary btn-sm">Submit</button>
          </div> <!-- card-body.// -->
      </div>
   </article> <!-- card-group-item.// -->
 </form>

【问题讨论】：

我试过这个，但它对我不起作用。它仅在单击网页返回按钮时显示复选框状态。但不是在页面刷新时...

标签： javascript html checkbox browser

【解决方案1】：

只需添加checked 即可

<input class="form-check-input" type="checkbox" name="doctype" value="offer" id="offer" checked>

【讨论】：

不幸的是，这并不能解决我的问题 :(。我只希望选中那些复选框，这些复选框是为过滤器选择的。详细信息：您选择一个复选框，点击提交，页面重新加载并显示所需的内容，但不再检查创建内容的复选框
根据您的建议，我所有的复选框都会被默认选中...无论如何，谢谢
你说Yet the checkboxes which where used as a filter are unchecked again when the results are shown. 所以必须检查的框的信息保存在某个地方？您可以遍历复选框 onload 并检查是否必须检查它们。如果必须选中它们，请将选中的属性添加到框中。
你能给我看一个简单的例子吗？

【解决方案2】：

在您的复选框中使用选中并阅读here

 <form>                  
  <article class="card-group-item">                      
    <header class="card-header">                          
      <span class="title">Document Types </span>               
    </header>                     
      <div class="filter-content">
          <div class="card-body">
             <label class="form-check" >
                 <input class="form-check-input" type="checkbox" name="doctype" value="offer" id="offer" checked>
                 <span class="form-check-label">Offer</span>
             </label> <!-- form-check.// -->
             <button type="submit" class="btn btn-secondary btn-sm">Submit</button>
          </div> <!-- card-body.// -->
      </div>
   </article> <!-- card-group-item.// -->
 </form>

【讨论】：

不幸的是，这并不能解决我的问题。我只希望选中那些为过滤器选择的复选框。根据您的建议，默认情况下我所有的复选框都会被选中...无论如何谢谢