如何提供2個打印選項？

Question

我知道JavaScript的window.print（）工作時，你想打印一個網頁，但我有一個客戶誰需要兩個選項。

1. 點擊一個鏈接到彩色打印
2. 打印黑色和白色。

我知道這可以通過打印樣式表完成，您可以將div設置爲display：none等，但我不確定如何在單擊時觸發每個選項。這是否需要一些JavaScript？

Answer 1

我會建議有兩個打印樣式表，然後有一對單選按鈕來選擇顏色或黑/白。更改單選按鈕時更改打印樣式表，然後只需打印一個調用print()的按鈕。

Answer 2

我認爲這樣做最簡單的方法是將主要與CSS - 建立與色彩和B/W選項的打印樣式表的切換與body類，如：

/* default option: color */ 
h1 { color: #00C; } 

/* b/w option */ 
body.bw h1 { color: #666 } 

然後使用JavaScript在body標記上切換bw類。像jQuery工具使得這個非常簡單，但如果你需要做沒有出庫，嘗試：

// these functions assume you don't already have any 
// CSS classes set on the body element 

function printBW() { 
    document.body.setAttribute('class', 'bw'); 
    window.print(); 
} 

function printColor() { 
    document.body.setAttribute('class', ''); 
    window.print(); 
} 

，並在你的HTML：

<a href="javascript:printColor()">Print color</a> | 
<a href="javascript:printBW()">Print B/W</a> 

我要指出，這真的值得學習一些簡單的jQuery用於這種事情 - 如果您想要在不使用庫的情況下支持舊版瀏覽器，涉及DOM操作的任何操作都會非常快速地複雜化。