ASP.NET中如何实现Checkbox状态在PostBack后保持不变

普通HTML复选框默认不会被ASP.NET跟踪状态，PostBack触发页面重载后会直接恢复为代码里写的默认勾选状态，你可以通过以下两种方案实现状态持久化：

方案1：改用ASP.NET服务器端CheckBox控件（最简便） #

直接替换现有原生控件，ASP.NET会自动通过ViewState保存勾选状态，PostBack后自动恢复，无需额外写逻辑：

<asp:CheckBox ID="checkboxid" CssClass="toggle" Checked="true" runat="server" />
<asp:Label AssociatedControlID="checkboxid" CssClass="lbl-toggle" Text="参与者" runat="server" />

只要页面的EnableViewState属性没有手动设为false，该控件的勾选状态会在所有PostBack操作后自动保留。如果要控制参与者列表的显示隐藏，既可以绑定前端JS点击事件，也可以写服务器端CheckedChanged事件处理逻辑。

方案2：保留原生HTML控件，手动保存状态 #

如果你不想使用服务器控件，有两种可选实现方式：

• 给原生控件加runat="server"属性，让ASP.NET识别为HTML服务器控件，自动支持状态保持：

<input id="checkboxid" class="toggle" type="checkbox" checked="checked" runat="server" />
<label for="checkboxid" class="lbl-toggle">参与者</label>

• 如果不想加runat属性，可以用隐藏域同步状态：
  1. 页面中新增隐藏域存储复选框状态：

  <input type="hidden" id="chkState" runat="server" value="true" />
  

  2. 加前端JS逻辑，复选框点击时同步状态到隐藏域：

  document.getElementById('checkboxid').addEventListener('change', function() {
    document.getElementById('chkState').value = this.checked;
  });
  

  3. 后端页面加载逻辑中，PostBack后读取隐藏域的值恢复复选框状态：

  if (IsPostBack)
  {
      ScriptManager.RegisterStartupScript(this, GetType(), "restoreChk", 
          $"document.getElementById('checkboxid').checked = {chkState.Value.ToLower()};", true);
  }
  

内容的提问来源于stack exchange，提问作者Hayley