Как создать документ Word из JavaScript с изменением ориентации страницы?(портрет в пейзаж) - PullRequest
0 голосов
/ 21 сентября 2018

Можно ли создать документ Word из JavaScript, который содержит 2 страницы с разной ориентацией (в одном документе)?Т.е. 1-я страница = портрет , 2-я страница = пейзаж ?Это в значительной степени именно то, что я после.Я пробовал так много вещей, таких как mso-break-type: section-break;МСО-специального характера: разрыв строки;страниц обкатки перед: всегда;и т.д. но не повезло.Заранее спасибо!Вот что у меня есть:

<script>
function export_to_word() {
   var link, blob, url;
   blob = new Blob(['\ufeff', document.getElementById("docx").innerHTML], {
         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);
 };
</script>

<html xmlns:office="urn:schemas-microsoft-com:office:office"
      xmlns:word="urn:schemas-microsoft-com:office:word"
      xmlns="http://www.w3.org/TR/REC-html40">

<br>
<button onclick="export_to_word()">Export</button>

<div id="docx">

    <style>
        @page portrait_A4_page {
            size:595.45pt 841.7pt;
            margin:1.0in 1.25in 1.0in 1.25in;
            mso-header-margin:.5in;
            mso-footer-margin:.5in;
            mso-paper-source:0;
        }

        div.portrait_A4_page { page:portrait_A4_page; }

        @page landscape_A4_page {
            size:841.7pt 595.45pt;
            mso-page-orientation: landscape;
            margin:1.25in 1.0in 1.25in 1.0in;
            mso-header-margin:.5in;
            mso-footer-margin:.5in;
            mso-paper-source:0;
       }

        div.landscape_A4_page { page:landscape_A4_page; }

    </style>


    <div class=portrait_A4_page>
        <p>standard A4 portrait page information</p>
    </div>    

    <div class=landscape_A4_page>
        <table border=1>
          <tr>
            <td>a table that goes really wide</td>  
          </tr>
        </table>
    </div>

</div>

1 Ответ

0 голосов
/ 24 сентября 2018

Нашли решение!Приведенный ниже код изменяется с книжного (стр. 1) на альбомный (стр. 2) в том же документе Word, созданном на JavaScript.Возможно, это можно было бы еще упростить, но это работает:

<script>
function export_to_word() {
   var link, blob, url;
   blob = new Blob(['\ufeff', document.getElementById("docx").innerHTML], {
         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);
 };
</script>

<html xmlns:office="urn:schemas-microsoft-com:office:office"
      xmlns:word="urn:schemas-microsoft-com:office:word"
      xmlns="http://www.w3.org/TR/REC-html40">

<br>
<button onclick="export_to_word()">Export</button>

<div id="docx">

<style>
    table, tr, td, th{
        border: 1px solid black;
        border-collapse: collapse;
        padding: 5px;
        text-align: left;
    }

    .normal {
        font-family:"Calibri",sans-serif; 
        line-height:107%;
        font-size:11.0pt;
        mso-ascii-font-family:Calibri;
        mso-ascii-theme-font:minor-latin;
    }

    @page portrait_A4_page  {
        size:595.3pt 841.9pt;
        margin:72.0pt 72.0pt 72.0pt 72.0pt;
        mso-header-margin:35.4pt;
        mso-footer-margin:35.4pt;
        mso-paper-source:0;
    }

    div.portrait_A4_page { page:portrait_A4_page; }

    @page landscape_A4_page {
        size:841.9pt 595.3pt;
        mso-page-orientation:landscape;
        margin:72.0pt 72.0pt 72.0pt 72.0pt;
        mso-header-margin:35.45pt;
        mso-footer-margin:35.45pt;
        mso-paper-source:0;
    }

    div.landscape_A4_page { page:landscape_A4_page; }

</style>

<div class=portrait_A4_page>
  <span class=normal>
    <p>standard A4 portrait page information</p>
  </span>
    <br clear=all style='mso-special-character:line-break; page-break-before:always'>        
</div>    

<br clear=all style='page-break-before:always; mso-break-type:section-break'>

<div class=landscape_A4_page>
    <table class=normal>
        <tr>
            <td>a table that goes really wide</td>  
        </tr>
    </table>
</div>

</div>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...