web-dev-qa-db-ja.com

HTMLテーブルをWordファイルとしてエクスポートし、ファイルの向きを変更する

HTMLテーブルをWordファイルにエクスポートするjquery関数があります。関数はうまく機能しますが、ランドサッペの向きにWordファイルを回転させる必要があります。誰かが私を助けてくれますか?

ここに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");
7
Martynas Tumas

HTMLをMicrosoft Wordにエクスポート

エクスポートされたHTMLにCSSを含めることにより、ページの向き、用紙サイズ、その他多くのプロパティを設定できます。使用可能なスタイルのリストについては、 MS Officeの接頭辞付きスタイルプロパティ を参照してください。一部のスタイルには依存関係があります。たとえば、mso-page-orientationを設定するには、以下のコードに示すように、ページのサイズも設定する必要があります。

更新:
FireFox、Chrome、Opera、IE10-11のWord 2010-2013でテスト済み。 ChromeおよびIE10で動作するようにマイナーコードを変更。window.Blobオブジェクトのないレガシーブラウザー(IE <10)では動作しません。これも参照してくださいSO =「createObjectURLは関数ではありません」というエラーが表示された場合は投稿: 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;
     }

完全に機能するデモを表示するには、以下を参照してください https://jsfiddle.net/78xa14vz/3/

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);
 };

そしてHTML:

<button onclick="export2Word(window.docx)">Export</button>
<div id="docx">
  <div class="WordSection1">

     <!-- The html you want to export goes here -->

  </div>
</div>
20
Roberto