Google Web app HTML-Seitenumbruch funktioniert nicht

Ich habe ein Google Apps Script "Web App". Ich versuche einen Seitenumbruch für das 2-seitige Dashboard zu erstellen.Google Web app HTML-Seitenumbruch funktioniert nicht

Ich habe das Problem mit einer einfachen Web-App reproduziert veröffentlicht here und hier ist der gesamte Code.

<body> 
<div>page1</div> 
<div class="break"></div> 
<div>page2</div> 
</body> 

<style> 
.break{ 
display:block; 
page-break-before:always; 
} 
</style>

Liegt es daran, dass die Web-App in einem einzigen Iframe angezeigt wird und keine Unterbrechung möglich ist?

Wenn ja - kann es in mehrere Iframes aufgeteilt werden ??

oder ist es etwas einfaches Ich vermisse.

EDIT: Ich habe jetzt auch

versucht

div.break{ 
display:block; 
page-break-before:always; 
}

Und

@media print { 
div.break{ 
display:block; 
page-break-before:always; 
} 
}

und das hat nichts ändern. Ich habe es in Chrome & IE versucht und beide ignorieren den Seitenumbruch.

EDIT 2:

ich denke, es muss ein iframe Problem sein, denn wenn ich meinen Code in eine Textdatei kopieren und öffnen Sie sie in Chrome auf 2 Seiten druckt. Wenn Sie es im Apps-Skript verwenden, muss die Pause ignoriert werden, vermutlich weil das Ganze in einem einzigen Iframe liegt. hmmmm ....

dank

Quelle

2017-07-21 MrPea

Sie haben Recht, Ihr HTML wird von Google Apps Script in iframe angezeigt. Wenn Sie versuchen, Web App Seite zu drucken, kann iframe nicht auf mehreren Seiten gedruckt werden.

Lösung: ein Text in Ihrem Web-App auswählen, zum Beispiel page1, in Zusammenhang mit iframe zu bekommen, schlug dann Drucke ..., wird es nur drucken, dass iframe Sie Text in ausgewählten:

Edit:

können Sie fügen 'drucken ...' Button rechts auf Ihre Web-App-Seite, um es mehr Benutzer-fr iendly:

<div>page1</div> 
<div class="break"></div> 
<div>page2</div> 

<!-- added print button (with class "hide-on-print" to not display it when printed) --> 
<button id="print" class="hide-on-print">Print...</button> 

<script> 
// open print dialog on button click 
document.getElementById('print').addEventListener('click', function(){ 
    window.print(); 
}); 
</script> 

<style> 
@media print { 
    .hide-on-print { 
     display: none 
    } 
    .break{ 
     display:block; 
     page-break-before:always; 
    } 
} 
</style>

Quelle

2017-07-21 11:27:16 Kos

Oh mein Gott, wie seltsam ist das !! Warum in aller Welt funktioniert das? Es funktioniert auch auf meinem Live-Dashboard. Etwas bizarr, dass ich meinen Benutzern sagen muss, die Überschrift zu markieren, bevor sie es drucken, aber wenn das die einzige Option ist. – MrPea

@MrPea können Sie Print-Schaltfläche direkt in Ihrer Web App-Seite hinzufügen, überprüfen Sie bitte Antwort bearbeiten. – Kos

ahhh große Köpfe denken gleich. Ich habe genau das Gleiche gemacht. Ich werde Ihre Antwort eher als korrekt bezeichnen als als meine, denn ohne Ihre Einsicht hätte ich das nicht gelöst. – MrPea

Bitte verwenden @media print {div.break {}} Versuchen Sie dies.

Quelle

2017-07-21 10:25:20 Rahul

danke.Leider hat das nicht funktioniert – MrPea

danke nochmal. immer noch keine freude. Ich habe die Frage bearbeitet, damit Sie den gesamten Code und einen Link zu einer veröffentlichten Testanwendung sehen können, um zu sehen, dass sie nicht funktioniert. – MrPea

Ich denke, es ist eine Einschränkung für Apps Script Web Apps und deren Verwendung von Iframes. Wie wenn ich den Code in eine reine Textdatei einfüge, funktioniert es gut. – MrPea

Zunächst wird der Kredit muss für den Hinweis auf Kos gehen, wenn ich Text in der iframe markieren Sie es dann richtig druckt - ich hätte nie gedacht, um zu versuchen, dass

so dass ich jetzt‘ Es wurde eine kleine Funktion hinzugefügt, die nur den iframe anstelle der Seite selbst druckt.

function printall() { 
window.print(); 
window.frames[0].print(); 
}

und ich habe eine Schaltfläche zum Dashboard für diese Funktion hinzugefügt. Ich werde nur sicherstellen, dass die Benutzer nicht das normale Druckmenü verwenden.

Quelle

2017-07-21 11:52:08 MrPea

Google Web app HTML-Seitenumbruch funktioniert nicht

Antwort

Verwandte Themen