Print specific HTML
Is it possible to output markup for the printer that is not actually embedded on the page?
The issue is that I have a Flash app which renders dynamic data from a backend in such a way that isn't really print friendly, but the client wants to have a printable version as well with raw data. I can easily output such content with a simple PHP page query, but the problem is getting this to be sent to the printer when the user invokes printing.
Is the only option to create a custom print button and require the user to click that (instead of their browser print function), then load the PHP page in a new wind开发者_如何学编程ow and print that page? Or can I effectively override the HTML content that gets sent to the printer in the same way I can override the CSS with the media attribute?
The HTML document sent to the printer must be the same one that is sent to the browser. A special print layout, as you suggest, is one common way of implementing this behavior.
Another might be to take the CSS media attribute idea and run with it: render the raw data in the original HTML document, hide it in the screen stylesheet, and show it in the print stylesheet. However, since it sounds like most of the navigation in this app occurs within the SWF and not on the browser's location bar (I'm still not totally sure I get the question), this may not be feasible. Perhaps the Flash file could send the raw data to the Javascript on the page to format it into the hidden HTML, but this might be a bit too much work to be worth the feature, and users might not even realize that they're meant to just print that page. I know I wouldn't be expecting that to just magically happen.
A print-me page might be your best option at this point. The Javascript+CSS solution might work, but it's probably not worth your time.
I would possibly use the content
property together with the :before
pseudo-element.
HTML:
<div id="justForPrint"></div>
CSS:
#justForPrint {
display: none
}
@media print {
#justForPrint {
display: block
}
#justForPrint:before {
content: "test data, test data, test data, test data, test data, test data, test data, test data, test data, test data, test data"
}
}
精彩评论