Jquery 使用复选框切换数据表

我正在努力使用一个特性，我想使用jQuery通过一个复选框打开/关闭数据表

如果我没有定义datatable，它实际上可以工作，然后我可以毫无问题地打开/关闭它

但我希望datatable在默认情况下处于打开状态，然后才将其关闭并重新打开。我收到重新初始化警告

我有这样的想法：

$('#datatable-switch').on('click',function(){

  if($(this).attr('data-click-state') == 0) {

    $(this).attr('data-click-state', 1);
    showLockersDataTable();

  } else {

    $(this).attr('data-click-state', 0)
    lockersTable.DataTable().destroy();
  }

});

// Get the jQuery Object for your DataTable
var example =  $('#example');

// Bind listener on the checkbox 
$('#datatable-switch').on('click',function(){

if($(this).attr('data-click-state') == 0) {

      $(this).attr('data-click-state', 1);
      showDataTable(example);

    }
    else {

      $(this).attr('data-click-state', 0)
      hideDataTable(example);
    }
});

---

这看起来真的没问题。你可能把你的工作搞砸了

showLockersDataTable();

及

我无法分析，因为您既没有提供

showLockersDataTable（）

也没有提供

lockersTable

但你必须像这样简单地解决它：

$('#datatable-switch').on('click',function(){

  if($(this).attr('data-click-state') == 0) {

    $(this).attr('data-click-state', 1);
    showLockersDataTable();

  } else {

    $(this).attr('data-click-state', 0)
    lockersTable.DataTable().destroy();
  }

});

// Get the jQuery Object for your DataTable
var example =  $('#example');

// Bind listener on the checkbox 
$('#datatable-switch').on('click',function(){

if($(this).attr('data-click-state') == 0) {

      $(this).attr('data-click-state', 1);
      showDataTable(example);

    }
    else {

      $(this).attr('data-click-state', 0)
      hideDataTable(example);
    }
});

其中两个使用的功能是：

// Declare show and hide functions
function showDataTable(dataTable){

  dataTable.DataTable();

}

function hideDataTable(dataTable){

  dataTable.DataTable().destroy();

}

现在，单击

上的侦听器已绑定，您可以启动页面加载

showDataTable();

这里有一个关于JSFIDLE.
数据表的问题，这可能会导致您的问题。@Tarekis根据您可以使用
destroy（）
在重新初始化新表之前销毁旧表。您可以显示您的第一次初始化吗？？showLockersDataTable在哪里？尝试初始化、销毁，然后立即重新初始化DataTables，而不选中复选框，只是为了从等式中删除该元素。@MattK是的，我现在明白了，我想它会自动在
DataTable（）
使用与否的位置重新启动，因此算作重新初始化，因为在链接中，
DataTable
存储到变量，并且
destroy（）
用于变量，而不是再次使用
DataTable（）
。但是它的工作原理是一样的，正如你在我的文章中所看到的。非常感谢！这很好用。我非常接近，复选框本身也有问题（错误的初始数据单击状态）。又是Thx。