Распечатать текстовый файл в JAVASCRIPT - PullRequest
0 голосов
/ 07 февраля 2019

Я пытаюсь загрузить текстовый файл с сервера на html-странице и распечатать содержимое.Текстовый файл имеет определенный формат, поэтому я не могу его изменить.Ниже приведен пример кода:

<code><html>
<head>
    <title>Print test</title>
    <script>
        var url = './text.txt';
        function load() {
            fetch(url).then(function(resp) {
                resp.text().then(function(text) {
                    var id = document.getElementById("abc");
                    id.textContent = text;
                });
            });
        }
        function print() {
            var id = document.getElementById("abc");
            var printwindow = window.open('', 'PRINT', 'height=400,width=600');
            printwindow.document.write('</head><body >');
            printwindow.document.write(id.textContent);
            printwindow.document.write('</body></html>');
            printwindow.document.close(); // necessary for IE >= 10
            printwindow.focus(); // necessary for IE >= 10
            printwindow.print();
            printwindow.close();
        }
    </script>
</head>
<body>
    <pre id="abc" style="height:85%;overflow:auto; background:white">
    
Загрузка Печать

Пример текстового файла:

text.txt

NAME                    = ABC
SURNAME                 = CDE
OCCUPATION              = XYZ
PLACE                   = UUU

Когда я нажимаю кнопку загрузки, текст загружается как есть, но при попытке печати он искажается, как показано на следующем рисунке: enter image description here

Может кто-нибудь сказать, пожалуйста, что я делаю не так?Спасибо

Ответы [ 2 ]

0 голосов
/ 07 февраля 2019
<code><html>
<head>
    <title>Print test</title>
    <script>
        var url = './text.txt';
        function load() {
            fetch(url).then(function (resp) {
                resp.text().then(function (text) {
                    var id = document.getElementById("abc");
                    id.textContent = text;
                });
            });
        }
        function print() {
            var id = document.getElementById("abc");
            var printwindow = window.open('', 'PRINT', 'height=400,width=600');
            printwindow.document.write('</head><body >');
            printwindow.document.write("<pre>" + id.textContent + "
"); printwindow.document.write (''); printwindow.document.close (); // необходимо для IE> = 10 printwindow.focus (); // необходимо для IE>= 10 printwindow.print (); printwindow.close ();} Load Печать
0 голосов
/ 07 февраля 2019

Вы теряете форматированный текст, потому что когда вы открываете всплывающее окно, вы добавляете текст без тега «pre», который сохраняет форматированный формат.

Вам просто нужно добавить тег «pre»во всплывающем окне:

<code>printwindow.document.write('</head><body ><pre>');
printwindow.document.write(id.textContent);
printwindow.document.write('
');
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...