在表单元素内打印html页面
[英]print html page inside form element
问题描述
A web page has <form> which needs to be sent to the printer for printing. 
网页具有<form> ，需要将其发送到打印机进行打印。 Keyboard Cmd + P will print the whole page which is not what I want. 键盘Cmd + P将打印整个页面，这不是我想要的。
I wired up the event to a button on the footer but not sure how to send only the form content to the printer. 我将事件连接到页脚上的按钮，但不确定如何仅将form内容发送到打印机。 Any idea how? 任何想法如何？
$('form').get(0).innerHTML
2 个解决方案
解决方案1
1 2016-08-12 12:25:22
This can easily be done using media queries . 使用media queries可以轻松完成此操作。 It'll work in IE9 and above, Chrome, FF, etc. For IE8, you can use polyfills. 它将在IE9及更高版本，Chrome，FF等中运行。对于IE8，您可以使用polyfills。
Now all you've to do is hide the elements when printing. 现在，您要做的就是在打印时隐藏元素。 Write something like this in your css 在css中写这样的东西
@media print {
#element-to-hide {
display: none;
}
}
This will completely hide the unwanted elements while printing. 这将在打印时完全隐藏不需要的元素。
解决方案2
0 已采纳 2016-08-12 12:31:11
You can get that element from page like a block and use Javascript to print it 您可以从页面像块一样获取该元素，然后使用Javascript进行打印
<div class="print" onclick="PrintElem('#idFromPage')">
And Js code to print the block you need: 和Js代码来打印您需要的块：
function PrintElem(elem) {
Popup($("body").html(), elem);
}
function Popup(data, elem) {
var mywindow = window.open('', 'Page to Print', 'height=600,width=800');
mywindow.document.write('<html><head><title>Print Document</title>');
mywindow.document.write('<style> body * { visibility: hidden; } .mobile-view {displa:none;} body, html { background:#fff !important;} #' + elem + ', #' + elem + ' * {visibility: visible; } </style>');
mywindow.document.write('</head><body>');
mywindow.document.write(data);
mywindow.document.write('</body></html>');
mywindow.document.close(); // necessary for IE >= 10
mywindow.focus(); // necessary for IE >= 10
$(mywindow).on('load', function () {
mywindow.print();
});
return true;
}
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.