h:outputText不会将\ r \ n字符分隔成新的行
我在一个String
variables中包含回车符和新行\r\n
一些文本。
text = "Text1\r\nText2\r\nText3";
我使用<h:outputtext>
来呈现它。
<h:outputText value="#{bean.text}" />
但它不能识别新的行字符和显示在下面的浏览器。
Text1 Text2 Text3
为什么<h:outputText>
不能把\n
换成新行?
我该怎么办? 我必须用<br />
replace\n
吗?
HTML中的换行符由<br />
元素表示,而不是由\n
字符表示。 更多的是,通过在浏览器中右键单击“ 查看源代码”来打开普通的HTML源代码,然后在所有地方“看到” \n
。 然而,它们在最终的HTML演示文稿中没有被呈现。 只有<br />
会。
所以,是的,你需要用<br />
replace它们。
<h:outputText value="#{fn:replace(bean.text,'\n','<br/>')}" escape="false" />
注意:使用Apache EL代替Oracle EL时,请双击\\n
的斜杠。
然而,这是丑陋的,如果值来自最终用户input,并且您没有事先对它进行消毒处理,那么escape="false"
会对XSS攻击敏感。 更好的select是将CSS white-space
属性设置为在父元素上预先格式化。 如果您想在块元素的上下文中换行,请设置pre-wrap
。 或者,如果您想要折叠空格和制表符,请设置上pre-line
。
例如
<h:outputText value="#{bean.text}" styleClass="preformatted" />
.preformatted { white-space: pre-wrap; }
这是正常的行为,在HTML连续的空格,如空格和linebreaks得到规范化,所以它显示为一个单一的空间。 如果您将包含换行符的文本直接包含在HTML源代码中,您将获得相同的显示效果。 为了兑现输出中的换行符,您必须将文本包装在pre
标签中或应用样式表类:
<pre><h:outputText value="..."/></pre> <div style="white-space: pre-wrap"><h:outputText value="..."/></div>
对于white-space
属性的其他可能的值看看这个页面: http : //www.w3schools.com/cssref/pr_text_white-space.asp
以前的答案对于大量的文本,例如非常宽的输出(没有文本换行),对于我来说会造成问题, style="white-space: pre-wrap"
没有修复; 或者只显示<br/>
作为文字,不作为行结尾。
最后,我使用h:inputTextarea
组件来显示文本,并将其设置为“只读”,不用replace换行符,也不必使用额外的样式或样式类。 而且,它可以resize以适合用户的需要,这是一个奖金。
<h:inputTextarea cols="70" rows="10" readonly="true" value="#{bean.text}" />
对于less量的文本,我发现上面提到的pre-line
选项能够很好地工作。
尝试尽可能使用最纯净的html。
如果你有静态内容使用:
<p>PrimeFacesTag<br/>JSF Tab<br/>#{yourBean.someVar}</p>
否则你也可以使用h:panelGroup,如果你还需要渲染属性的话
<h:panelGroup rendered=true> <p:outputLabel value="Primefaces Tag" /> <br /> <h:outputLabel value="JSF Tab" /> <br /> <h:outputLabel value="#{yourBean.someVar}" /> </h:panelGroup>
结果:
Primefaces Tag JSF Tab someVarValue