Drucken Javascript ist leer mit Anzeige: block/none

Question

Jemand in diesem Forum hilf mir für Drucken Sie ein div mit Javascript. Aber wenn eine put Anzeige keine für den Inhalt, den ich nicht will und Block für die div ich möchte drucken, zeigen meine Druckfunktion zeigen mir eine leere Seite.

Aber wenn ich setzte Sichtbarkeit: Versteckt/Sichtbar, meine Druck Arbeit, aber ich habe mein Ergebnis mit vielen weißen Seite Ursache der Lebensfähigkeits nur

versteckt

ich einen Code Stift: enter link description here

Meine CSS: `

body * { 
    display: none !important; 
    } 
    .print-div, .print-div * { 
    display: block !important; 
    }` 

Javascript

function addPrintClassAndPrintDiv(divId) { 

    //remove .print-div class from all element if any 
    $(".print-div").removeClass("print-div"); 

    //add .print-div class to that div you want to print 
    $("#"+divId).addClass("print-div"); 

    //print 
     window.print(); 
} 

Also ich möchte die Möglichkeit, jeden div zu drucken und das Ergebnis ist jedes div nur in einer Seite drucken

Vielen Dank!

Answer 1

Ich glaube, die einfachste Lösung für Sie wäre, die Sichtbarkeit versteckte/sichtbare Ansatz, die Sie skizziert und nehmen Sie einfach alle Elemente, die nicht print-div Klasse height: 0 haben. Unter der Annahme, dass alle Elemente, die Sie wollen entweder Druck oder auszublenden (Ihre Druck divs) sind <article> Elemente Sie folgende CSS verwenden können:

body * { 
    visibility: hidden; 
} 

.print-div, .print-div * { 
    visibility: visible; 
} 

article:not(.print-div) { 
    height: 0; 
} 

Der :not() Pseudo-Selektor werden alle Elemente zielen, die nicht über die print-div Klasse .