Heim > Artikel > Web-Frontend > Implementierungsmethoden für Einzelseitendruck und Stapeldruck von Webseiten

Implementierungsmethoden für Einzelseitendruck und Stapeldruck von Webseiten

小云云Original: 2018-03-17 15:07:4111900Durchsuche

Dieser Artikel teilt Ihnen hauptsächlich die Implementierungsmethoden des Einzelseitendrucks und des Stapeldrucks von Webseiten mit.

Druckereignis: window.print()

1. Einzelseitendruck (Layoutdruck):

function printCnt(){
    //1.获取当前页的html代码  
    var body = window.document.body.innerHTML; 
	//2.要打印的部分（#print里面的内容就是要打印的内容）
    window.document.body.innerHTML =document.getElementById("print").innerHTML; 
    window.print();
    window.document.body.innerHTML = body;
	//重新载入当前文档:
    location.reload();
}
注意：location.reload();要加，因可解决JS window.print()第二次点击事件失效问题

2 🎜>Hinweis:

(1). Seitenumbruch steuern: page-break-after:always

Hinweis: Vermeiden Sie die Verwendung in Tabellen, schwebenden Elementen und Blockelementen mit Rahmen-Paging-Attributen

(2). Fügen Sie dem Inhalt jeder Seite eine Höhe hinzu, um Verzerrungen zu vermeiden

(3) Wenn der CSS-Stil nicht zum Drucken geladen ist, fügen Sie bitte hinzu:

<p  id="printcnt">
	<p id="page1" style="height：300px;page-break-after:always" >报告单1</p>
	<p id="page2" style="height：300px;page-break-after:always" >报告单2</p>
</p>

var printStr='';

(4). Wenn Sie window.open("showPrint.html","print"); verwenden, um die Vorschauseite zu drucken

var printHead = "<html><head><meta http-equiv=&#39;Content-Type&#39; content=&#39;text/html; charset=utf-8&#39;>"
			+"<link rel=&#39;stylesheet&#39;  type=&#39;text/css&#39; href=&#39;css/printcss.css&#39;></head><body>";
var printCnt=&#39;打印的内容&#39;;
printStr = printHead + printCnt;

Verwandte Empfehlungen:

printStr = printHead + printCnt;  
//如果是本地测试，需要先新建Print.html，如果是在域中使用，则不需要
var pwin=window.open("showPrint.html","print");
pwin.document.write(printStr); 
pwin.document.close();//这个是必须的 
注意：pwin.document.close(); 可以关闭showPrint.html的页面，使其第二次打印的时候不会跳转到showPrint.html

Drei Möglichkeiten zur Implementierung des Seitendrucks mit Javascript_Typische Spezialeffekte

Javascript-Code für die Implementierung des teilweisen Seitendrucks _Javascript-Kenntnisse

js oder jquery zum Realisieren von Seitendruck- und Teildruck-_Javascript-Fähigkeiten

Das obige ist der detaillierte Inhalt vonImplementierungsmethoden für Einzelseitendruck und Stapeldruck von Webseiten. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme：

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Vorheriger Artikel：Detaillierte Erläuterung der Beispiele für das JavaScript-JSON-FormatNächster Artikel：Detaillierte Erläuterung der Beispiele für das JavaScript-JSON-Format

In Verbindung stehende Artikel

Mehr sehen