设置一个JSF外部链接的样式,使其看起来像一个按钮 [英] Styling one JSF external link to make it look like a button
问题描述
Primefaces 3.5,Omnifaces 1.6
Primefaces 3.5, Omnifaces 1.6
我有一组带有图标的按钮.这些按钮可在页面上执行某项操作(例如,在数据表中删除或添加新行).我想添加看起来与按钮完全相同的新内容",但带有外部链接.如果我单击此新按钮,则必须打开新的选项卡/窗口.为此,我使用p:commandButton
和h:outputLink
.
I have a group of buttons with icons. The buttons have an action to do on the page (such as delete or add new row in datatable). I want to add new "something" that looks exactly as buttons do, but with an external link. If I click on this new button, new tab/window have to be opened. For that purpose I am using p:commandButton
and h:outputLink
.
<p:commandButton action="#{bean.do1}" icon= ...>
<p:commandButton action="#{bean.do2}" icon= ...>
<h:outputLink value="#{bean.url}" target="_blank">
<i class="icon-external-link"></i>
</h:outputLink>
我该如何实现?
推荐答案
-
使用
p:button
,其作用类似于链接:Use a
p:button
, which acts like a link:<p:button href="http://www.stackoverflow.com" value="Go to SO" />
If you want a blank target and starting from Primefaces 3.5.5, there's the chance to use the
target
attribute directly:<p:button target="_blank" href="http://www.stackoverflow.com" value="Go to SO" />
-
低于PF 3.5.5时,您可以使用某些JavaScript在空白目标中打开它:
When being below PF 3.5.5, you could do some javascript to open it in a blank target:
<p:button value="Go to SO" onclick="window.open('http://www.stackoverflow.com')" />
-
使用javascript 上面的所有选项更改浏览器的 窗口位置.为了生成可收获的机器人 HTML 链接元素,请使用
h:outputLink
(或仅使用纯HTMLa
元素), 并使用Primefaces的类设置样式: All of the choices above use javascript to change the browser's window location. In order to generate a bot-harvestable HTML link element, make use of a
h:outputLink
(or just a plain HTMLa
element), and style it using Primefaces' classes:<h:outputLink value="http://www.stackoverflow.com" styleClass="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only"> <span class="ui-button-text">Go to SO</span> </h:outputLink>
另请参见:
这篇关于设置一个JSF外部链接的样式,使其看起来像一个按钮的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!