Question

它在本地工作得非常漂亮，但当我将其上传到WordPress网站时，新的打印窗口会立即打开/关闭。只测试了Chrome，就像我说的那样，我没有问题，直到我将它上传到服务器？

使用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);

}

上面的编辑（打印窗口现在停止，但没有在Chrome中显示的内容;在FF中工作）

function printDiv(divName) {

“使用严格”;

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();

}

Answer 1

让它在Chrome中正常运行。打开打印窗口，预览并在之后关闭。在此代码和确保加载jQuery之间，它现在在Chrome中完全正常运行！

此脚本允许您在同一页面上打印多个/单独的DIV。将打印按钮分配给DIV，它将打印DIV！

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);

返回true; }

对于打印按钮代码（将您的DIV命名为您喜欢的任何内容）：

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

仅供参考：将3000改为500，因为打开新窗口后打印预览窗口耗时太长。

打印窗口在本地工作，但不在现场w / WordPress

1 个答案: