我如何提供2种打印选项?

时间:2011-09-20 19:53:04

标签: php javascript css printing

我知道javascript window.print()在您想要打印网页时有效,但我有一个客户需要两个选项。

  1. 点击链接以彩色打印
  2. 黑白打印。
  3. 我知道这可以通过打印样式表来完成,您可以将div设置为display:none等,但我不确定如何在单击时触发每个选项。这需要一些javascript吗?

2 个答案:

答案 0 :(得分:4)

我建议有两个打印样式表,然后有一对单选按钮选择颜色或黑/白。更改单选按钮后更改打印样式表,然后只需一个打印按钮调用print()

答案 1 :(得分:1)

我认为最简单的方法是使用CSS - 使用颜色和b / w选项设置打印样式表,使用body类切换,例如:

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

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

然后使用Javascript切换bw标记上的body类。像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操作的东西都会变得非常复杂。