📄 输出类标签.htm
字号:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>新建网页 1</title>
</head>
<body>
<p>输出类标签</p>
<div id="PageContent">
<table cellSpacing="0" cellPadding="0" width="100%" border="0" id="table3">
<tr>
<td class="pagebody" vAlign="top">
<table style="CLEAR: both" cellSpacing="0" cellPadding="0" width="100%" border="0" id="table4">
<tr>
<td class="pagecontent" vAlign="top" width="100%">
<div class="wiki-content">
输出类的标签包括了outputLabel、outputLink、outputFormat与
outputText，分别举例说明如下：<h3>outputLabel</h3>
<p> 产生<label> HTML卷标，使用for属性指定组件的client ID，例如：</p>
<div class="code" style="BORDER-TOP-STYLE: solid; BORDER-RIGHT-STYLE: solid; BORDER-LEFT-STYLE: solid; BORDER-BOTTOM-STYLE: solid">
<div class="codeContent">
<pre class="code-java"><h:inputText id=<span class="code-quote">"user"</span> value=<span class="code-quote">"#{user.name}"</span>/>
<h:outputLabel <span class="code-keyword">for</span>=<span class="code-quote">"user"</span> value=<span class="code-quote">"#{user.name}"</span>/></pre>
</div>
</div>
<p> 这会产生像是以下的标签：</p>
<div class="code" style="BORDER-TOP-STYLE: solid; BORDER-RIGHT-STYLE: solid; BORDER-LEFT-STYLE: solid; BORDER-BOTTOM-STYLE: solid">
<div class="codeContent">
<pre class="code-java"><input id=<span class="code-quote">"user"</span> type=<span class="code-quote">"text"</span> name=<span class="code-quote">"user"</span> value=<span class="code-quote">"guest"</span> />
<label <span class="code-keyword">for</span>=<span class="code-quote">"user"</span>></pre>
</div>
</div>
<h3>outputLink</h3>
<p> 产生<a> HTML标签，例如：</p>
<div class="code" style="BORDER-TOP-STYLE: solid; BORDER-RIGHT-STYLE: solid; BORDER-LEFT-STYLE: solid; BORDER-BOTTOM-STYLE: solid">
<div class="codeContent">
<pre class="code-java"><h:outputLink value=<span class="code-quote">"../index.jsp"</span>>
<h:outputText value=<span class="code-quote">"Link to Index"</span>/>
<f:param name=<span class="code-quote">"name"</span> value=<span class="code-quote">"MyName"</span>/>
</h:outputLink></pre>
</div>
</div>
<p> 你可搭配<f:param>帮链接加上参数，所有的参数都会变成 name=value
的型态附加在连结后。</p>
<p> value所指定的内容也可以是JSF EL绑定。</p>
<h3>outputFormat</h3>
<p> 产生指定的文字讯息，可以搭配<f:param>来设定讯息的参数以格式化文字讯息，例如：</p>
<div class="code" style="BORDER-TOP-STYLE: solid; BORDER-RIGHT-STYLE: solid; BORDER-LEFT-STYLE: solid; BORDER-BOTTOM-STYLE: solid">
<div class="codeContent">
<pre class="code-java"><f:loadBundle basename=<span class="code-quote">"messages"</span> <span class="code-keyword">var</span>=<span class="code-quote">"msgs"</span>/>
<h:outputFormat value=<span class="code-quote">"#{msgs.welcomeText}"</span>>
<f:param value=<span class="code-quote">"Hello"</span>/>
<f:param value=<span class="code-quote">"Guest"</span>/>
</h:outputFormat></pre>
</div>
</div>
<p> 如果您的messages.properties包括以下的内容：</p>
<div class="code" style="BORDER-TOP-STYLE: solid; BORDER-RIGHT-STYLE: solid; BORDER-LEFT-STYLE: solid; BORDER-BOTTOM-STYLE: solid">
<div class="codeContent">
<pre class="code-java">welcomeText={0}, Your name is {1}.</pre>
</div>
</div>
<p> 则{0}与{1}会被取代为<f:param>设定的文字，最后显示的文字会是：</p>
<div class="code" style="BORDER-TOP-STYLE: solid; BORDER-RIGHT-STYLE: solid; BORDER-LEFT-STYLE: solid; BORDER-BOTTOM-STYLE: solid">
<div class="codeContent">
<pre class="code-java">Hello, Your name is Guest.</pre>
</div>
</div>
<p> 另一个使用的方法则是：</p>
<div class="code" style="BORDER-TOP-STYLE: solid; BORDER-RIGHT-STYLE: solid; BORDER-LEFT-STYLE: solid; BORDER-BOTTOM-STYLE: solid">
<div class="codeContent">
<pre class="code-java"><h:outputFormat value=<span class="code-quote">"{0}, Your name is {1}."</span>>
<f:param value=<span class="code-quote">"Hello"</span>/>
<f:param value=<span class="code-quote">"Guest"</span>/>
</h:outputFormat></pre>
</div>
</div>
<h3>outputText</h3>
<p> 简单的显示指定的值或绑定的讯息，例如：</p>
<div class="code" style="BORDER-TOP-STYLE: solid; BORDER-RIGHT-STYLE: solid; BORDER-LEFT-STYLE: solid; BORDER-BOTTOM-STYLE: solid">
<div class="codeContent">
<pre class="code-java"><h:outputText value=<span class="code-quote">"#{user.name}"</span>/></pre>
</div>
</div>
</div>
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</body>
</html>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -