Checkbox不保留Bootstrap折叠的值

<div id="collapseExample" class="collapse">
  <input type="checkbox" id="checkboxExample">
  <label for="checkboxExample">Checkbox</label>
</div>

<script>
  var checkbox = document.getElementById('checkboxExample');
  var collapse = document.getElementById('collapseExample');

  collapse.addEventListener('show.bs.collapse', function () {
    // 保存复选框的选中状态
    checkbox.dataset.checked = checkbox.checked;
  });

  collapse.addEventListener('shown.bs.collapse', function () {
    // 恢复复选框的选中状态
    checkbox.checked = (checkbox.dataset.checked === 'true');
  });

  collapse.addEventListener('hide.bs.collapse', function () {
    // 保存复选框的选中状态
    checkbox.dataset.checked = checkbox.checked;
  });

  collapse.addEventListener('hidden.bs.collapse', function () {
    // 恢复复选框的选中状态
    checkbox.checked = (checkbox.dataset.checked === 'true');
  });
</script>