2017-05-19 5 views
0

es funktioniert wunderbar lokal, aber wenn ich es auf die WordPress-Website hochladen, öffnet das neue Druckfenster und blinkt auf/aus Bildschirm sofort. Nur mit Chrome getestet und wie gesagt, ich habe keine Probleme, bis ich es auf den Server hochlade?Drucken Fenster arbeitet lokal, aber nicht vor Ort mit WordPress

Javascript:

function printDiv(divName) { 

"use strict"; 
var divToPrint = document.getElementById(divName); 

var WindowObject = window.open('', 'PrintWindow', 'width=750,height=650,top=50,left=50,toolbars=no,scrollbars=yes,status=no,resizable=yes'); 
WindowObject.document.writeln('<!DOCTYPE html>'); 
WindowObject.document.writeln('<html><head><title>Your Safari Print Results</title>'); 
WindowObject.document.writeln('<link rel="stylesheet" id="fonts-googleapis-css" href="http://fonts.googleapis.com/css?family=Lato%3A400%2C100%2C300%2C700%2C900&#038;ver=4.6" type="text/css" media="all">'); 
WindowObject.document.writeln('<link rel="stylesheet" type="text/css" href="NewWinPrintScreen_hmap.css">'); 
WindowObject.document.writeln('</head><body onload="window.print()"><center><img src="logo.png" width="219" height="78"><br><div class="line"></div></center><br><br><span class="pg_title">Canine Wellness HealthMap</span>'); 

WindowObject.document.writeln(divToPrint.innerHTML); 

WindowObject.document.writeln('</body></html>'); 

WindowObject.document.close(); 
setTimeout(function() { WindowObject.close(); }, 500); 

}

EDITED oben unter (Print Window jetzt Aufenthalte, aber keine Inhalte angezeigt in Chrome, funktioniert in FF)

function printDiv(divName) { 

"use strict" ;

var WindowObject = window.open('', 'PrintWindow', 'width=750,height=650,top=50,left=50,toolbars=no,scrollbars=yes,status=no,resizable=yes'); 
var divToPrint = document.getElementById(divName); 
WindowObject.document.writeln('<!DOCTYPE html><html><head><title>Your Safari Print Results</title><link rel="stylesheet" type="text/css" href="css/NewWinPrintScreen_hmap.css"></head><body><center><img src="images/logo.png" width="219" height="78"><br><div class="line"></div></center><br><br><span class="pg_title">Canine Wellness HealthMap</span>'); 
WindowObject.document.writeln(divToPrint.innerHTML); 

WindowObject.document.writeln('</body></html>'); 

/* Delaying the print event */ 
setInterval(function() {  }, 100); 
    WindowObject.focus(); 
    WindowObject.print(); 
    WindowObject.close(); 

}

+0

Haben Sie [Ihre Konsole überprüft?] (Http://stackoverflow.com/documentation/javascript/185/getting-started-with-javascript/714/using-console-log) –

+0

Mir keine Fehler gibt es dort. Ich habe mit dem Skript herumgespielt und bekam das Druckfenster, um aufzustehen, aber Inhalt ist nicht in der Vorschau und druckt leer. In Firefox jedoch arbeiten. – flipflopmedia

Antwort

0

Verstanden richtig in Chrome arbeiten. Öffnet das Druckfenster, Vorschau und schließt danach. Zwischen diesem Code und der Gewährleistung, dass jQuery geladen wird, ist es jetzt in Chrome voll funktionsfähig!

Mit diesem Skript können Sie mehrere/separate DIVs auf derselben Seite drucken. Weisen Sie dem DIV die Drucktaste zu, und das ist der DIV, der gedruckt wird!

function printDiv(divName) { // jshint ignore:line 

"use strict"; 
var divToPrint = document.getElementById(divName); 
var mywindow = window.open('', 'PrintWindow', 'width=750,height=650,top=50,left=50,toolbars=no,scrollbars=yes,status=no,resizable=yes'); 
mywindow.document.write('<html><head><title>Your Safari Print Results</title><link rel="stylesheet" type="text/css" href="css/NewWinPrintScreen_hmap.css"></head>'); 
mywindow.document.write('<body><center><img src="images/logo.png" width="219" height="78"><br><div class="line"></div></center><br><br><span class="pg_title">Canine Wellness HealthMap</span>'); 

mywindow.document.write(divToPrint.innerHTML); 

mywindow.document.write('</body></html>'); 

setTimeout(function() { // wait until all resources loaded 
    mywindow.document.close(); // necessary for IE >= 10 
    mywindow.focus(); // necessary for IE >= 10 
    mywindow.print(); // change window to winPrint 
    mywindow.close(); // change window to winPrint 
}, 3000); 

zurück wahr; }

Und für den Print-Knopf-Code (Name Ihre DIVs, was Sie wollen):

<button onclick="Javascript:printDiv('Print-Needs-LifeStyle-Life-Stage')">Print</button>

FYI: Changed 3000-500, weil es zu lange nahm für das Fenster Druckvorschau zu kommen nach dem Öffnen des neuen Fensters.

Verwandte Themen