TCPDF 创建 PDF 耗时太长，此时如何显示加载效果

Question

我有一个锚标记，带有指向页面的 href，它将使用 TCPDF 生成 PDF。生成 PDF 需要花费太多时间。同时界面页面保持不变，它在浏览器标题栏顶部显示一个加载图标。如何在界面上显示一个加载器，下载完成后这个加载器需要消失。

提前致谢。

Answer 1

这里有一些东西可以帮助您入门。

HTML：

<a id="loadPDF" href="#">Get PDF</a>

JS：

// When link is clicked show loading indicator
$('#loadPDF').on("click", function () {

    // Save element
    var link = $(this);

    // Insert loading indicator after link
    link.after("<span> Loading...</p>");

    // Hide indicator after 2 seconds
    setTimeout(function(){ link.next().hide(); }, 2000);
});

您可以将“正在加载...”替换为动画 gif。如果你想变得更漂亮，你可以查找一些代码，使加载指示器跟随鼠标移动。至于在 PDF 加载后删除加载指示器有点棘手。在示例中，我让它在 2 秒后消失。

示例：JSFiddle