如何仅在选中或取消选中后单击保存按钮时切换dataTable特定列

<table id="myTable">
  <thead>
    <tr>
      <th><input type="checkbox" id="selectAll"></th>
      <th>列1</th>
      <th>列2</th>
      <th>列3</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td><input type="checkbox" class="columnCheckbox"></td>
      <td>数据1</td>
      <td>数据2</td>
      <td>数据3</td>
    </tr>
    <!-- 其他行数据 -->
  </tbody>
</table>
<button id="saveButton">保存</button>

$(document).ready(function() {
  var table = $('#myTable').DataTable();
  var selectedColumns = [];

  // 全选/取消全选复选框的事件监听器
  $('#selectAll').on('change', function() {
    if ($(this).is(':checked')) {
      $('.columnCheckbox').prop('checked', true);
    } else {
      $('.columnCheckbox').prop('checked', false);
    }
  });

  // 单个列复选框的事件监听器
  $('.columnCheckbox').on('change', function() {
    var column = table.column($(this).closest('td').index() + ':visible');
    var columnIndex = column.index();

    if ($(this).is(':checked')) {
      // 添加选中的列到数组中
      selectedColumns.push(columnIndex);
    } else {
      // 从数组中移除取消选中的列
      var index = selectedColumns.indexOf(columnIndex);
      if (index > -1) {
        selectedColumns.splice(index, 1);
      }
    }
  });

  // 保存按钮的点击事件监听器
  $('#saveButton').on('click', function() {
    // 切换选中的列的可见性
    table.columns().visible(false);
    for (var i = 0; i < selectedColumns.length; i++) {
      table.column(selectedColumns[i]).visible(true);
    }
  });
});