jsf - 设置一个JSF外部链接的样式，使其看起来像一个按钮

Question

Primefaces 3.5，Omnifaces 1.6

我有一组带有图标的按钮。这些按钮可在页面上执行某项操作（例如，在数据表中删除或添加新行）。我想添加看起来与按钮完全一样的新“内容”，但带有外部链接。如果我单击此新按钮，则必须打开新的选项卡/窗口。为此，我使用p:commandButton和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>

我怎样才能做到这一点？

Answer 1

使用p:button，其作用类似于链接：

<p:button href="http://www.stackoverflow.com" value="Go to SO" />

如果要使用空白目标并从Primefaces 3.5.5开始，请使用 there's the chance
target属性直接：

<p:button target="_blank" href="http://www.stackoverflow.com" value="Go to SO" />

当低于PF 3.5.5时，您 could do一些JavaScript可以在空白目标中打开它：

<p:button value="Go to SO" onclick="window.open('http://www.stackoverflow.com')" />

以上所有选择均使用javascript更改浏览器的
窗口位置。为了生成可收割机器人的 HTMLlink元素，请使用 h:outputLink（或仅使用普通的HTML a元素），
并使用Primefaces的类设置样式：

<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>

也可以看看：


window.location.href vs clicking on an Anchor