簡單打印示例

我需要在簡單的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

回答