与按钮的JS相关的错误

Question

我已经在我的<div>中声明了ID，不管出现什么错误，如何解决这个错误。

​

​

以下是我的代码供参考

<div class="row">
 <div>
  <input type="checkbox" data-column="0" class="toggle-vis" data-label-text="No" checked/>
  <input type="checkbox" data-column="1" class="toggle-vis" data-label-text="Region" checked>
  <input type="checkbox" data-column="2" class="toggle-vis" data-label-text="IBSE Node" checked/>
 </div>
<div>
 <table class="data-table stripe hover multiple-select-row nowrap" id="example">
  <thead>
   <tr>
    <th class="table-plus datatable-nosort">No</th>
    <th>Region</th>
    <th>IBSE Node</th>
   </tr>
  </thead>
 </table>
</div>

JS

<script>
    $(function(){
        $.fn.bootstrapSwitch.defaults.onColor = 'success';
        $.fn.bootstrapSwitch.defaults.offColor = 'danger';
        $.fn.bootstrapSwitch.defaults.size = 'mini';
        $.fn.bootstrapSwitch.defaults.state = 'false';
        $.fn.bootstrapSwitch.defaults.inverse = 'true';
        $(".toggle-vis").bootstrapSwitch();
            var table = $('#example').DataTable();
        $('.toggle-vis').on('switchChange.bootstrapSwitch', function(event, state) {
            event.preventDefault();
            var column = table.column($(this).attr('data-column'));
            column.visible( ! column.visible() );
        });
    });
</script>

Answer 1

您不能重新初始化datatable，您需要在再次初始化之前销毁它。在您的切换函数中添加这一行。

$("#example").dataTable().fnDestroy();