52

String改行と改行を含む変数があります\r\n。

text = "Text1\r\nText2\r\nText3";

を使って紹介してい<h:outputtext>ます。

<h:outputText value="#{bean.text}" />

しかし、改行文字を認識せず、webbrowser では以下のように表示されます。

テキスト1 テキスト2 テキスト3

<h:outputText>改行が改行されないのはなぜ\nですか?

私は何をすべきか？と交換\nする必要があり<br />ますか?

4

3 に答える 3

116

HTML の改行は<br />、文字ではなく要素で表されます\n。さらに、平均的な HTML ソース コードを右クリックして開き、ブラウザでソースを表示すると、すべての場所が「表示」\nされます。ただし、それらは最終的な HTML プレゼンテーションではそのままでは表示されません。意志だけ<br />。

したがって、はい、それらを に置き換える必要があります<br />。これにはJSTL 関数を使用できます。

<... xmlns:fn="http://xmlns.jcp.org/jsp/jstl/functions">

<h:outputText value="#{fn:replace(bean.text,'\n','&lt;br/&gt;')}" escape="false" />

注: Oracle EL の代わりに Apache EL を使用する場合は、 のようにバックスラッシュをダブルエスケープします\\n。

<h:outputText value="#{fn:replace(bean.text,'\\n','&lt;br/&gt;')}" escape="false" />

そうしないと、例外が発生し、メッセージが表示されますFailed to parse the expression with root cause org.apache.el.parser.ParseException: Encountered <ILLEGAL_CHARACTER>。

ただし、これはすべて醜く、値がエンドユーザーの入力から取得され、事前にサニタイズしないと、XSS 攻撃escape="false"に対して敏感になります。より良い代替手段は、 CSSプロパティを使用し続け、親要素で preformatted に設定することです。ブロック要素のコンテキスト内で行を折り返す場合は、 を設定します。または、スペースとタブも折りたたむ場合は、 を設定します。\nwhite-spacepre-wrappre-line

例えば

<h:outputText value="#{bean.text}" styleClass="preformatted" />

.preformatted {
    white-space: pre-wrap;
}
于 2013-02-01T13:51:19.663 に答える
12

これは正常な動作です。HTML では、スペースや改行などの連続する空白が正規化されるため、単一のスペースとして表示されます。改行を含むテキストを 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

于 2013-02-01T13:52:11.820 に答える
6

以前の回答では、非常に広い出力 (テキストの折り返しなし) など、大量のテキストで問題が発生しましたが、これstyle="white-space: pre-wrap"は修正されませんでした。または&lt;br/&gt;、行末としてではなく、テキストとして表示しただけです。

最後に、h:inputTextareaコンポーネントを使用してテキストを表示し、それを「読み取り専用」にしました。これにより、改行を置き換えたり、追加のスタイルや styleClasses を使用したりすることなく、すぐに機能しました。また、ユーザーのニーズに合わせてサイズを変更できます。これはボーナスです。

<h:inputTextarea cols="70" rows="10" readonly="true" value="#{bean.text}" />

少量のテキストのpre-wrap場合、上記のhenkoで提案されているように、このオプションがうまく機能することがわかりました.

于 2014-10-22T23:06:13.633 に答える