Javascript 将 html 表导出为 word 文件并更改文件方向
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/36330859/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
export html table as word file and change file orientation
提问by Martynas Tumas
I have jquery function which exporting html table to word file. Function works great, but I need to rotate a word file to landsacpe orientation. Can somebody help me?
我有将 html 表导出到 word 文件的 jquery 函数。功能很好用，但我需要将 word 文件旋转到 landsacpe 方向。有人可以帮助我吗？
Here is js function:
这是js函数：
<SCRIPT type="text/javascript">
$(document).ready(function () {
$("#btnExport").click(function () {
var htmltable= document.getElementById('tblExport');
var html = htmltable.outerHTML;
window.open('data:application/msword,' + '\uFEFF' + encodeURIComponent(html));
});
});
Response.AddHeader("Content-Disposition", "attachment;filename=myfilename.docx");
回答by Roberto
Export HTML to Microsoft Word
将 HTML 导出到 Microsoft Word
You may set page orientation, paper size, and many other properties by including the CSS in the exported HTML. For a list of available styles see MS Office prefixed style propertiesSome styles have dependencies. For example, to set mso-page-orientation you must also set the size of the page as shown in the code below.
您可以通过在导出的 HTML 中包含 CSS 来设置页面方向、纸张大小和许多其他属性。有关可用样式的列表，请参阅MS Office 前缀样式属性某些样式具有依赖性。例如，要设置 mso-page-orientation，您还必须设置页面的大小，如下面的代码所示。
Updated:
Tested with Word 2010-2013 in FireFox, Chrome, Opera, IE10-11. Minor code changes to make work with Chrome and IE10. Will not work with legacy browsers (IE<10) that lack window.Blob object. Also see this SO post if you receive a "createObjectURL is not a function" error: https://stackoverflow.com/a/10195751/943435
更新：
在 FireFox、Chrome、Opera、IE10-11 中使用 Word 2010-2013 进行测试。少量代码更改以适用于 Chrome 和 IE10。不适用于缺少 window.Blob 对象的旧版浏览器 (IE<10)。如果您收到“createObjectURL 不是函数”错误，请参阅此 SO 帖子：https: //stackoverflow.com/a/10195751/943435
@page WordSection1{
mso-page-orientation: landscape;
size: 841.95pt 595.35pt; /* EU A4 */
/* size:11.0in 8.5in; */ /* US Letter */
}
div.WordSection1 {
page: WordSection1;
}
To view a complete working demo see: https://jsfiddle.net/78xa14vz/3/
要查看完整的工作演示，请参阅：https: //jsfiddle.net/78xa14vz/3/
The Javascript used to export to Word:
用于导出到 Word 的 Javascript：
function export2Word( element ) {
var html, link, blob, url, css;
css = (
'<style>' +
'@page WordSection1{size: 841.95pt 595.35pt;mso-page-orientation: landscape;}' +
'div.WordSection1 {page: WordSection1;}' +
'</style>'
);
html = element.innerHTML;
blob = new Blob(['\ufeff', css + html], {
type: 'application/msword'
});
url = URL.createObjectURL(blob);
link = document.createElement('A');
link.href = url;
link.download = 'Document'; // default name without extension
document.body.appendChild(link);
if (navigator.msSaveOrOpenBlob ) navigator.msSaveOrOpenBlob( blob, 'Document.doc'); // IE10-11
else link.click(); // other browsers
document.body.removeChild(link);
};
And the HTML:
和 HTML：
<button onclick="export2Word(window.docx)">Export</button>
<div id="docx">
<div class="WordSection1">
<!-- The html you want to export goes here -->
</div>
</div>
