带有 HTML 内容的 Primefaces 全局工具提示答案

【问题标题】：Primefaces global tooltip with HTML content带有 HTML 内容的 Primefaces 全局工具提示
【发布时间】：2016-08-11 07:27:57
【问题描述】：

在我的 JSF 页面中，我在这样的行列上使用带有工具提示的数据表：

<p:dataTable var="item" ...>
  <p:column headerText="#{bundle['item.name']}">
    <!--
    <h:outputText value="#{item.name}" title="#{simpleTooltipGenerator.generate(item)}"/>
    -->
    <h:outputText id="name" value="#{item.name}"/>
    <p:tooltip for="name" escape="false" value="#{simpleTooltipGenerator.generate(item)}"/>
  </p:column>
</p:dataTable>

simpleTooltipGenerator.generate() 是一种生成以下 HTML 工具提示的方法：

<div class="ui-tooltip-text ui-shadow ui-corner-all">
  <table>
    <tbody>
      <tr><td class="key">Lastname</td><td class="value">Doe</td></tr>
    <tr><td class="key">Firstname</td><td class="value">John</td></tr>
    </tbody>
  </table>
  <div class="adresse spacer"></div>
  <div class="adresse title">Address</div>
  <table>
    <tbody>
      <tr><td class="key">OFFICE</td><td class="value">...</td></tr>
      <tr><td class="key">HOME</td><td class="value">...</td></tr>
    </tbody>
  </table>
</div>

这按预期工作，但是当我使用全局工具提示 <p:tooltip escape="false"/> 和 <h:outputText value="#{item.name}" title="#{simpleTooltipGenerator.generate(item)}"/> 时，工具提示中只会显示生成的 HTML 代码！为全局工具提示使用固定文本有效吗？！

这是一个错误，即使设置了escape="false"，全局工具提示也不支持 HTML 内容，还是不支持？！

我的环境是 WildFly 10.0.0-Final 上的 Primefaces 6.0

【问题讨论】：

标签： html jsf primefaces

【解决方案1】：

来自PrimeFaces Documentation：

全局工具提示

... 由于全局工具提示更有效由于在所有工具提示目标中仅使用一个工具提示实例，因此建议改为使用明确的工具提示除非您有自定义案例，例如不同的选项，自定义内容。

首先我要说的是不支持。当我尝试它仍然有效。因此，您的问题似乎缺少 globalSelector 属性，该属性默认为 a,:input,:button

如果你想支持<h:outputText />（呈现为<span />）绑定，只需添加一个propper选择器，如：

<p:tooltip escaped="false" globalSelector="a,:input,:button,span" />

【讨论】：

添加@irieill 提到的缺少的 globalSelector 属性解决了问题！