Question

我正在尝试为jQuery数据表启用导出按钮，但按钮不会显示。

$('#tblServicesReport').DataTable({
  dom: 'Bfrtip',
  buttons: [ 'copy', 'excel', 'pdf' ]
});

Datatables版本是1.10.15

Answer 1

试试这个，确保加载所有必要的min文件。

$(document).ready(function() {
    $('#example').DataTable( {
        dom: 'Bfrtip',
        columns: [
            { data: 'name' },
            { data: 'surname' },
            { data: 'position' },
            { data: 'office' },
            { data: 'salary' }
        ],
        buttons: [
            {
                extend: 'copyHtml5',
                exportOptions: { orthogonal: 'export' }
            },
            {
                extend: 'excelHtml5',
                exportOptions: { orthogonal: 'export' }
            },
            {
                extend: 'pdfHtml5',
                exportOptions: { orthogonal: 'export' }
            }
        ]
    } );
} );

演示 - https://jsfiddle.net/4tuupc5f/6/

确保加载所有必需的文件

https://code.jquery.com/jquery-1.12.4.js
https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js
https://cdn.datatables.net/buttons/1.5.1/js/dataTables.buttons.min.js
https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js
https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.32/pdfmake.min.js
https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.32/vfs_fonts.js
https://cdn.datatables.net/buttons/1.5.1/js/buttons.html5.min.js

CSS文件

https://cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css
https://cdn.datatables.net/buttons/1.5.1/css/buttons.dataTables.min.css

Answer 2

确保整合按钮javascript库https://cdn.datatables.net/buttons/1.5.1/js/dataTables.buttons.min.js

为什么不显示jquery数据表的按钮？

2 个答案: