页面重新加载时保存选中的复选框

Question

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

这是我的复选框代码的一部分（我是 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>

Answer 1

只需添加checked它<input&nbsp;class="form-check-input"&nbsp;type="checkbox"&nbsp;name="doctype"&nbsp;value="offer"&nbsp;id="offer"&nbsp;checked>

Answer 2

使用选中的复选框并在此处阅读&nbsp;<form>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp; <article class="card-group-item">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp; <header class="card-header">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp; &nbsp; <span class="title">Document Types </span>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; </header>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; <div class="filter-content">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="card-body">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<label class="form-check" >&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<input class="form-check-input" type="checkbox" name="doctype" value="offer" id="offer" checked>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<span class="form-check-label">Offer</span>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;</label> <!-- form-check.// -->&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<button type="submit" class="btn btn-secondary btn-sm">Submit</button>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div> <!-- card-body.// -->&nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp;</article> <!-- card-group-item.// -->&nbsp;</form>