有条件地渲染JSF组件以进行打印 [英] Conditionally render JSF components for printing

问题描述

我只想打印网页的特定部分(而不是整个页面).如何在JSF中实现这一目标?

I want to print only a certain part of my webpage (so not the whole page). How can I achieve this in JSF?

推荐答案

通常由CSS使用display: none|block控制.检查 CSS媒体规则.

This is normally to be controlled by CSS with display: none|block. Check the CSS media rules.

例如，作为默认CSS文件中的@media print {}:

For example, as @media print {} inside a default CSS file:

@media print {
    #header, #footer, #menu { 
        display: none;
    }
}

(上面的示例将隐藏ID为header，footer和menu的HTML元素)

(the above example will hide HTML elements with IDs header, footer and menu)

或通过通用样式类:

@media screen {
    .printonly { 
        display: none;
    }
}

@media print {
    .noprint { 
        display: none;
    }
    .printonly { 
        display: block;
    }
}

然后将styleClass="noprint"添加到您要隐藏的内容中，将styleClass="printonly"添加到您仅想显示的内容中.

You then add styleClass="noprint" to those which you'd like to hide from print, and styleClass="printonly" to those which you'd like to show in print only.

您还可以将特定于打印的CSS放在其自己的样式表文件中，并使用<link media="print">或<h:outputStylesheet media="print">进行引用，如下所示:

You can also put the print specific CSS in its own stylesheet file and reference it using <link media="print"> or <h:outputStylesheet media="print"> as below:

<link rel="stylesheet" href="#{request.contextPath}/css/print.css" media="print" />
<!-- Or -->
<link rel="stylesheet" href="#{resource['css/print.css']}" media="print" />
<!-- Or -->
<h:outputStylesheet name="css/print.css" media="print" />

#header, #footer, #menu { 
    display: none;
}

请注意，<h:outputStylesheet media>属性仅在JSF 2.1中添加，因此，如果您仍在JSF 2.0上，请考虑至少升级到2.1(应100％兼容，而无需在Webapp本身中进行任何代码和配置更改).否则，只需采用普通的HTML <link>方法.

Noted shoud be that <h:outputStylesheet media> attribute was only added in JSF 2.1, so if you're still on JSF 2.0, consider upgrading to at least 2.1 (should be 100% compatible without any code and configuration changes in the webapp itself). Otherwise just go for the plain HTML <link> approach.

这篇关于有条件地渲染JSF组件以进行打印的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！