window.print() verhält sich wie es gedruckt wird, tut aber nichts

Ich versuche, ein einfaches Dokument zu drucken, aber nichts gedruckt wird. Wenn ich auf die Schaltfläche "Drucken" klicke, wird die Druckwarteschlange hinzugefügt und die Warteschlange wird sofort verlassen, aber nichts passiert. Der Drucker verhält sich nicht so, als wolle er drucken. Ich habe einen print.csswindow.print() verhält sich wie es gedruckt wird, tut aber nichts

@media print{ 
    * { 
    display: none; 
    } 

    #preview { 
    display: inline; 
    } 
    #preview input { 
    display: none; 
    } 
}

und ich habe

<link rel="stylesheet" href="print.css" type="text/css" media="print" />

zu meinem HTML hinzugefügt. Es zieht das Druckmenü hoch und verhält sich so, als würde es drucken, tut aber nichts. Ich habe das noch nie ausprobiert, daher fehlt mir vielleicht ein wichtiger Aspekt, aber gleichzeitig scheint es richtig zu sein.

-Code für die Schaltfläche

<input type="button" onclick="window.print()" value="print" />

Vorschau ist die div, dass ich zu drucken versuche (ich die Innerhtml in einer Funktion hinzufügen)

<body style="background-color: white; height: 100%; width: 100%" onload="buildForm()"> 
    <aside id="overlay"> 
    <section onclick="modal()"></section> 
    <div id="preview"></div> 
    </aside>

Auch dies ist eine Electron App, wenn das hat irgendetwas damit zu tun haben. Ja, der Drucker funktioniert auch. Ich kann von anderen Quellen drucken, vorausgesetzt, es gibt Inhalte zu drucken.

Aufgrund der langen Mengen von Code ist hier ein jsfiddle es brechen zu helfen. Hinweis Das wird nicht funktionieren, da es Knotenmodule im Code hat, da es sich um eine Electron App ist

Quelle

2016-04-08 SirParselot

Diese CSS wahrscheinlich das Problem, es versteckt sich alles: '* {display: none; } '. – Mottie

@Mottie es verbirgt alles, aber es sollte #preview zeigen, da es nach dem * ist, oder versteckt es Dinge, die wie die Sachen in benötigt werden? Es druckt immer noch nicht einmal mit dem * – SirParselot

Inline-Stile wie '

' können nicht durch CSS-Definitionen überschrieben werden. Versuchen Sie, das 'display: none' in einem' @screen {} 'Medienwrapper einzustellen. – Mottie

stellte sich heraus, das ein Problem mit Electron war seit 0.37.x veröffentlicht wurde, während die pdf.dll fehlt. Sie können es aus 0.36.12 Release kopieren und es dem Ordner dist hinzufügen. Arbeitete danach wie ein Zauber.

Quelle

2016-04-11 12:14:06 SirParselot

diese Änderung Versuchen:

HTML

<div id="preview"></div>

CSS

@media screen { 
    #preview { display: none; } 
} 
@media print{ 
    * { 
    display: none; 
    } 

    #preview { 
    display: inline; 
    } 
    #preview input { 
    display: none; 
    } 
}

Quelle

2016-04-08 16:48:41 Mottie

genau was ich gerade schreibe +1 –

Habe es noch nicht repariert. immer noch die gleichen Ergebnisse. – SirParselot

Ehrlich gesagt, wäre es besser, '* {display: none; } 'und stattdessen Zielelemente, die Sie ausblenden möchten. – Mottie

Sie müssen auch alle #preview Kinder sichtbar machen:

body * {display: none;} 
#preview, #preview * {display: initial !important;}

Quelle

2016-04-08 16:51:37 Quantastical

Ich dachte, das wäre die Lösung, aber immer noch nichts. Die gleichen Ergebnisse – SirParselot

@SirParselot Haben Sie nach dem Update sichergestellt, dass Sie das zwischengespeicherte CSS löschen? Ich habe ein vereinfachtes Beispiel erstellt und konnte es richtig drucken. Vielleicht gibt es mehr CSS, die es beeinflusst. Haben Sie versucht, DevTools zu öffnen und den Renderer so einzustellen, dass er die Druckmedien verwendet, damit Sie die Elemente überprüfen können? – Quantastical

Es ist eine Electron-App, also gibt es keinen Cache, soweit ich weiß. Außerdem weiß ich nicht, wie man den Renderer auf das Druckmedium – SirParselot

window.print() verhält sich wie es gedruckt wird, tut aber nichts

Antwort

Verwandte Themen