dataTables导出按钮显示在自定义位置？

我想在自定义div中显示我的dataTable导出按钮。 我怎样才能做到这一点 ？

我目前的代码

这是默认代码，按钮在我的表格上单独显示。 我怎么编辑这个？

$(document).ready(function() { $('#example').DataTable( { dom: 'Bfrtip', buttons: [ 'excelHtml5', 'csvHtml5', ] } ); } ); 

我想要显示的地方

   Export  CSV XLS  

这里是小提琴https://jsfiddle.net/qt9p2fwt/3/

Answer 1

克隆按钮事件并销毁元素非常令人头疼。 为什么不隐藏按钮面板并以编程方式单击按钮？ 可以这样自动化：

  Export userlist Export as CSV Export as XLS Copy to clipboard Export as PDF  

将initComplete处理程序添加到dataTables初始化选项：

 initComplete: function() { var $buttons = $('.dt-buttons').hide(); $('#exportLink').on('change', function() { var btnClass = $(this).find(":selected")[0].id ? '.buttons-' + $(this).find(":selected")[0].id : null; if (btnClass) $buttons.find(btnClass).click(); }) } 

更新小提琴 – > https://jsfiddle.net/qt9p2fwt/17/