简单打印示例

我需要在简单的html页面上提供一个print链接。简单打印示例

当用户点击它时，我想要一个显示print preview的弹出窗口，系统打印机应该出现。我猜想用window.print();选项，但这直接给窗口打印选项没有预览。我想先预览页面，然后调用window.print（）;一个例子html将有助于...

更多的你提供的例子也可以在其中打印媒体类型。所以正常的html颜色看起来是红色的。但是当选择打印链接时，我们需要以蓝色显示打印预览。我知道这可能是在css文件中使用@media print的重写方法。

请举例说明...谢谢

究竟什么是你的题？你在你的问题中回答了这两个问题。 – Blender

他要求一个例子......“任何示例请”应该暗示在:) – ChrisR

@Blender我知道通过添加window.print将加载打印选项 '

' 但它不会首先显示打印预览。我该怎么做？ –

打印预览功能是客户特定的。最新的chrome显示打印预览，但大多数其他浏览器只是在调用print（）方法时显示打印对话框。

关于打印样式，您应该阅读打印样式表。 Eric Meyer几年前发表的A-list文章是一个很好的开端，其中有一些体面的例子。 http://www.alistapart.com/articles/goingtoprint/

2011-12-20 07:32:04 ChrisR

假设report.html是您要打印的页面。开发页面的方式是它接受媒体参数作为GET参数。即像yoursite.com/report.html?media=X - 其中X可以是'screen'，'print'等，如果X是空的，它可以使用“屏幕”

写2 css文件即screen.css和print.css的默认值 - 根据该值媒体参数（X）将screen.css或print.css导入您的页面。

在screen.css，写一个 '@media屏幕' 里面你的风格DEFS块，如：

@media screen { 
    body { 
    ... screen style here ... 
    } 
}

在print.css，写一个 '@media屏幕，打印' 块内等你的风格DEFS ：

@media screen, print { 
    body { 
    ... print style here ... 
    } 
}

在你report.html，假设你有一个打印按钮，在其onclick，叫window.open('report.html?media=print', ...)。在接收到Ctrl + P时，也可以从连接到文档对象的keydown处理程序执行相同的操作。

而且，在你的页面的onload，检查媒体的说法是“打印”，如果它，然后在短暂的延迟之后调用window.print()（比如500毫秒），即是这样的：

if(window.location.href.indexOf('media=print')!=-1) { 
    setTimeout(function() { window.print(); }, 500); 
}

2011-12-20 07:42:29 techfoobar

回答