js jquery jquery.wordexport.js 实现导出word
由于工作需要,将一个页面导出word文档,主要是简历!经过百度搜索之后,没找到结果,无奈之下只能求助Google,意外发现jquery一款插件可以实现这个功能!而且效果还算可以!
基本可以实现想要的功能!
首先需要的js文件如下,贴出github地址,大家自由下载!
https://github.com/eligrey/FileSaver.js/
https://github.com/markswindoll/jQuery-Word-Export
首先你要引入jquery 和FileSaver.js
<script src="http://jquery.min.js"></script> <script src="FileSaver.js"></script>
一定先引入以上两文件之后再引入jquery.wordexport.js
<script src="jquery.wordexport.js"></script>
需要到处的内容这样命名,id名字自己随意,注意对应下方的jquery调用
<div id="page-content">
Your content here
</div>
使用方法,创建一个导出的按钮例如:
<a class="word-export" href="javascript:void(0)"> 导出 </a>
js代码如下
<script type="text/javascript"> jQuery(document).ready(function($) { $("a.word-export").click(function(event) { $("#page-content").wordExport(); }); }); </script>
希望对你有用
应用过程中可能会遇到报错,主要是因为图片导致的!
我是这样解决的,大概在36行左右,找到如下代码,按照下方演示注释,添加相应代码之后,应该就可以
for (var i = 0; i < img.length; i++) { // Calculate dimensions of output image var w = Math.min(img[i].width, options.maxWidth); var h = img[i].height * (w / img[i].width); // Create canvas for converting image to data URL //这是添加的代码-------------------------------------------- var img_id = "#"+img[i].id; $(‘<canvas>‘).attr("id", "xzhiliao_resume_word_img_" + i).width(w).height(h).insertAfter(img_id); //------------------------------------------------- //下面是注释的代码 // var canvas = document.createElement("CANVAS"); // canvas.width = w; // canvas.height = h; // // Draw image to canvas // var context = canvas.getContext(‘2d‘); // context.drawImage(img[i], 0, 0, w, h); // // Get data URL encoding of image // var uri = canvas.toDataURL("image/png"); // $(img[i]).attr("src", img[i].src); // img[i].width = w; // img[i].height = h; // // Save encoded image to array // images[i] = { // type: uri.substring(uri.indexOf(":") + 1, uri.indexOf(";")), // encoding: uri.substring(uri.indexOf(";") + 1, uri.indexOf(",")), // location: $(img[i]).attr("src"), // data: uri.substring(uri.indexOf(",") + 1) // }; }
郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。