问题
<a href="_javascript:window.print()">
<img class="noPrint" src="Images/Print_icon.png" border="0"></a>
This is the only code i am using to implement print function. It generates a print dialog box. And to make the page print friendly, I have used stylesheets and hid the div's that I dont want in the print page.
I now need to generate a print preview of that page. Any suggestions?
Thanks
回答1:
Basically there is no functionality available until now but you can achieve by creating a copy of same html file with name print.htm with the Print css and open this file on button Print Preview click as a popup page and render it, This will preview the page :
<html>
<head>
<title></title>
//do it in simple way..
<script LANGUAGE=”JavaScript”>
function displayMessage(printContent) {
var inf = printContent;
win = window.open(”print.htm”, ‘popup’, ‘toolbar = no, status = no’);
win.document.write(inf);
win.document.close(); // new line
}
</script>
</head>
<body>
<div id=”printarea”>Print this stuff.</div>
<a href=”javascript:void(0);” onclick=”displayMessage(printarea.innerHTML)”>Print Preview</a>
</body>
</html>
回答2:
I really don't see this as practical. Your web page has no knowledge of font size (zoom level), page margins, orientation or anything else you'd need to know to construct a print preview image.
In addition, it's possible for a page to reference images and other content from other sites. How will your code know what is needed here?
Fortunately, the browsers I use (IE and Chrome) provide print preview, so you'd get it for free anyway. But if you're trying to implement print preview manually, I just don't see that as a practical goal.
回答3:
One way is to use the mediaType print in your css. This css will only be applied when you open you page in print mode. Add following class in your css file:
@media print {
// printer friendly page css
}
Another way is by using pure javascript. there are bunch of articles on internet for this:
If you are having a common template for printer friendly pages. I would suggest you to create a seperate page altogether for print version and when user clicks on link navigate it to your new printer friendly page. I would recommed this approach as this is foolproof and you have complete control over it, rest of approaches have some pitfalls.
来源：https://stackoverflow.com/questions/10203199/generate-print-preview-of-a-web-page-in-asp-net