如何将html中的canvas标签转换为word文件？答案

【问题标题】：how to convert canvas tag in html to a word file?如何将html中的canvas标签转换为word文件？
【发布时间】：2016-07-06 13:28:25
【问题描述】：

我不知道如何将canvas标签转换为word文件。

我使用this tutorial 尝试了 jQuery Word Export 插件，但我收到了这个错误：

TypeError: $(...).wordExport is not a function

这是我的代码：

jQuery(document).ready(function($) {
    $("a.word-export").click(function(event) {
        $("#page-content").wordExport();
    });
});

【问题讨论】：

我们需要更多代码来查看问题所在。
您不认为向我们展示错误是个好主意吗，因为您正在寻求与该错误相关的帮助？
正如您链接到的页面上的文档所说，您是否“确保在 jQuery 库和 filesaver.js 之后包含单词导出插件。”？
如果您将画布制作成图片然后将其处理为图片怎么办？ var dataURL = canvas.toDataURL();
您可以先将整个网页源保存到本地不同的html文件中。然后从画布制作图像并将其保存在本地。然后用这个图像替换保存的源代码中的画布。然后用你的软件把这个html文件转换成word文档。

标签： javascript jquery jquery-plugins

【解决方案1】：

这可能是您的代码有问题，或者没有加载。可能 WordExport 不存在于您的源代码中或在您的脚本下加载。

<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-rc1/jquery.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/2014-11-29/FileSaver.min.js'></script>
// And here link to file of jquery.wordexport.js source

检查这个小提琴https://jsfiddle.net/mansim/at148xnm/它的工作原理，看看你做错了什么

【讨论】：

对不起，我只想运行这个 "$("#page-content").wordExport();"部分代码，我将 wordexport 添加到我的源代码中并将其加载到两个 .js 文件下。但我收到此错误“TypeError: $(...).wordExport is not a function”
它显然没有正确加载 wordexport 库。正如您在我的示例中看到的那样，它自然而然地工作。如果你需要更好的帮助，你应该发布你的整个代码，只有这样才能找到你的错误。
根据你的说法，我创建了一个 div 标签并将图像放入其中。调用 word.export 时出现错误 var iDiv = document.createElement('div'); iDiv.id = '块'; iDiv.className = '块'; var canvas = document.getElementsByClassName("jade-schematic-diagram");变种图像 = 新图像（）； image.id = "pic" image.src = canvas[0].toDataURL("image/png"); iDiv.appendChild(图像); $(".block").wordExport();
TypeError: $(...).wordExport 不是函数