Печать клонированного div в новом окне
Я использую следующий код для печати div в новом окне:
$('#PrintNews').bind('click', function () {
var approot = '<%=AppRoot %>';
var printContents = new $("#divToPrint").clone();
var myWindow = window.open("", "popup", "width=800,height=600,scrollbars=yes,resizable=yes," +
"toolbar=no,directories=no,location=no,menubar=no,status=no,left=250px,top=80px");
var doc = myWindow.document;
doc.open();
$(printContents).find("#PrintNews").remove();
$(printContents).find("#bottom").remove();
doc.write("<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">");
doc.write("<html>");
doc.write("<head>");
doc.write("<link href='" + approot + "/Themes/print.css' rel='stylesheet' type='text/css' />");
doc.write("<link href='" + approot + "/Themes/secretaryPortal.css' rel='stylesheet' type='text/css' />");
doc.write("</head>");
doc.write("<body style='font: 11pt/1.2 Arial !important;'>");
doc.write("<div class='story'>");
doc.write($(printContents).html());
doc.write("</div>");
doc.write("</body>");
doc.write("</html>");
myWindow.document.close();
myWindow.focus();
myWindow.print();
myWindow.close();
});
});
Он открывает диалог печати. Но страница не с оригинальным css. если я изменил 4 последних строки на:
doc.document.close();
doc.focus();
doc.print();
doc.close();
Он открывает страницу с правильным CSS. Однако диалог печати не открывается. Я получаю сообщение об ошибке Uncaught TypeError: Cannot call method 'close' of undefined удается Uncaught TypeError: Cannot call method 'close' of undefined
Я должен открыть его в новом окне, потому что мне нужно изменить размер для диалога печати, я знаю @media print
в вашем описании вместо:
doc.document.close();
doc.focus();
doc.print();
doc.close();
использовать:
myWindow.focus();
myWindow.print();
myWindow.close();
Это окончательное решение: * Благодаря Yussuf выше
$('#PrintNews').bind('click', function () {
var approot = '<%=AppRoot %>';
var printContents = new $("#divToPrint").clone();
var myWindow = window.open("", "popup", "width=800,height=600,scrollbars=yes,resizable=yes," +
"toolbar=no,directories=no,location=no,menubar=no,status=no,left=250px,top=80px");
$(printContents).find("#PrintNews").remove();
$(printContents).find("#bottom").remove();
myWindow.document.write("<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">");
myWindow.document.write("<html>");
myWindow.document.write("<head>");
myWindow.document.write("<link href='" + approot + "/Themes/print.css' rel='stylesheet' type='text/css' />");
myWindow.document.write("<link href='" + approot + "/Themes/secretaryPortal.css' rel='stylesheet' type='text/css' />");
myWindow.document.write("</head>");
myWindow.document.write("<body style='font: 11pt/1.2 Arial !important;'>");
myWindow.document.write("<div class='story'>");
myWindow.document.write($(printContents).html());
myWindow.document.write("</div>");
myWindow.document.write("</body>");
myWindow.document.write("</html>");
myWindow.focus();
myWindow.print();
myWindow.close();
});