我的任务是在DataTables中显示切换JavaScript,但似乎不仅按钮,而且功能也没有.

这是我的代码

的HTML
    
      
        
        
        
         
      

  <div class="col-lg-12 col-md-12 col-sm-12 mb-30">
    <table class="data-table stripe hover multiple-select-row nowrap" id="example">
      <thead>
        <tr>
          <th class="table-plus datatable-nosort">No</th>
          <th>Name</th>
          <th>Phone</th>
          <th>Email</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td class="table-plus">1</td>
          <td>Michael</td>
          <td>123456789</td>
          <td>michael@gmail.com</td>
        </tr>
      </tbody>
    </table>
  </div>
</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>

我正在尝试在此处复制某人的代码JSFiddle,不幸的是未出现切换.