如何破坏数据表的首次初始化（模态内的数据表）

销毁dataTables实例的主要原因是，如果您想更改初始化选项（例如change

paging

destroy:true

var table = $('#records_table').DataTable({   ...   destroy : true});

更进一步，我认为您正在做一些倒退。

• 为什么用jQuery

  $('#records_table tbody').empty();

  而不是清空表

  table.clear()

  ？
• 为什么使用jQuery

  $('#records_table tbody').append(trHTML);

  而不是使用注入记录

  table.row.add([...])

  ？

这是一个类似于问题中的代码方案，每次显示模式时，它都会重新初始化dataTable而不会发生冲突：

var table;$('#modal').on('show.bs.modal', function() {   $.ajax({      url: url,      dataType: 'JSON',      success: function(response) {         var response = $.parseJSON(response.contents);         //clear the table, if it exists         if (table) table.clear();         //reinitialise the dataTable table = $('#records_table').DataTable({destroy: true,bLengthChange: false,paging: false         });         $.each(response, function(i, item) {console.log("inserting", item);table.row.add([  item.name,  item.position]).draw();         });       }    });});

参见演示-> http://jsfiddle.net/bz958dxj/

但是，您实际上根本不需要破坏表，这只会降低性能：

//global table objecttable = $('#records_table').DataTable({   bLengthChange: false,   paging: false});$('#modal').on('show.bs.modal', function() {   $.ajax({      url: url,      dataType: 'JSON',      success: function(response) {         var response = $.parseJSON(response.contents);         //clear the table         table.clear();         //insert data          $.each(response, function(i, item) {console.log("inserting", item);table.row.add([  item.name,  item.position]).draw();         });       }    });});

演示-> http://jsfiddle.net/8mjke9ua/

注意 ：我只是

assume

.modal-header

注意
：请注意

$.parseJSON(response.contents)