[英]Print page from HTML template
我有一个HTML页面,其顶部显示数据摘要,底部显示网格。 我在顶部有一个按钮,它必须以某种格式在页面上打印信息。 为了展示这种特定格式并获得企业的认可,我创建了一个附加的HTML页面,该页面由div和一个表格组成。 单击页面1中的打印按钮时,将执行以下代码:
function print() {
$.get('PrintLayout.html', function (data) {
var $data = $(data);
$data.find('#field1').text($('#field1').text() + ' (' + $('#field2').text() + ')');
$data.find('#field3').text($('#field3').text());
$data.find('#field4').text($('#field4').text());
$data.find('#field5').text(kendo.toString(field5, 'dd MMMM yyyy'));
$data.find('#field6').text($('#field6').text());
$data.find('#grid').append($('#grid').html());
var html = $('<div>').append($data.clone()).remove().html(),
width = 1120,
height = 600,
left = (screen.width / 2) - (width / 2),
top = (screen.height / 2) - (height / 2),
printPage = window.open('', 'Print', 'scrollbars=yes, width=' + width + ', height=' + height + ', left=' + left + ', top=' + top);
printPage.document.open();
printPage.document.write(html);
printPage.document.close();
printPage.focus();
printPage.print();
printPage.close();
return false;
});
}
该代码的作用是获取打印布局页面的HTML,并将字段值添加到该页面上的特定元素中。
当我查看弹出窗口的标记并查看源代码时,我注意到甚至没有html或head元素。 弹出的窗口包含所有正确位置的所有信息,但在纸上,我的网格标题和列未对齐。 我知道,如果页面的标记被更正,则打印输出也将看起来正确。
我怎样才能解决这个问题? 请注意,PrintLayout.html页面确实具有适当的标记,只是$ data JQuery不会以某种方式提取此标记。
我想要的只是获取PrintLayout.html页面的HTML,将值插入该页面上的占位符,在弹出窗口中显示生成的标记并进行打印。 我认为我过于复杂了,但是找不到更简单的方法。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.