javascript - 在按钮中获取未捕获的类型错误 : when i try to use my . tableExport

Question

从今天早上开始我就面临着一个巨大的问题，我正在尝试将我的表格导出到 pdf 文件中。如果我将脚本放入 a 中，没有其他任何内容，页面加载并且 dl 启动，则该脚本工作正常。

但我想要它在一个按钮中!当我这样说时:

$(document).ready(function () {
    $('#downloadPDF').on('click', function (e) {
        console.log("test");
        e.preventDefault();
        $('table').tableExport({ 
            type: 'pdf', 
            jspdf: {     
                orientation: 'l', 
                format: 'a3', 
                margins: { 
                    left: 10, 
                    right: 10, 
                    top: 20, 
                    bottom: 20 
                }, 
                autotable: { 
                    styles: { 
                        fillColor: 'inherit', 
                        textColor: 'inherit' 
                    },
                    tableWidth: 'auto' 
                } 
            } 
        });
    });
});

<button type="button" id="downloadPDF" class="btn btn-default">Default</button>

我在 Chrome 控制台中收到此错误:

Uncaught TypeError: $(...).tableExport is not a function(anonymous function) @ Auto:290jQuery.event.dispatch @ jquery-1.10.2.js:5109elemData.handle @ jquery-1.10.2.js:4780

我不明白为什么。因为它在不参加事件时效果很好。

Answer 1

为此，您需要 a table export plugin .

在您的页面中添加这些导入:

<script type="text/javascript" src="tableExport.js">
<script type="text/javascript" src="jquery.base64.js">

//and these if you want export to pdf
<script type="text/javascript" src="jspdf/libs/sprintf.js">
<script type="text/javascript" src="jspdf/jspdf.js">
<script type="text/javascript" src="jspdf/libs/base64.js">

显然，将 src 路径替换为下载位置。