添加 data-container="body" 后，工具提示在表内不起作用答案

【问题标题】：tool tip is not working inside table after adding data-container="body"添加 data-container="body" 后，工具提示在表内不起作用
【发布时间】：2018-06-05 13:19:21
【问题描述】：

工具提示在表格中不起作用

<td data-container="body">
  <span ng-show="false"> {{Plist.PriceLine}}</span>
  <a href="EditPlayer/PlayerList/{{Plist.PLID}}/Search" target="_blank">
    #{{Plist.PlayerID}}
  </a> 
  &nbsp;
  <span data-placement="top" 
    data-container="body" 
    ng-if="!Plist.Active" 
    data-toggle="tooltip" 
    title="This Team list is inactive">
  <a class="fa fa-exclamation-circle"></a>
  </span> 
  {{Plist.PlayerTitle}}
</td>

我已经将data-container="body" 添加到 td，但是当我将鼠标悬停在表格之外时，我仍然无法获得工具提示，我能够获得工具提示。

【问题讨论】：

你想在跨度或锚标签上显示工具提示吗？
@Milind 跨度
请提供一个展示问题的有效 plnkr/jsfiddle 示例

标签： html angularjs twitter-bootstrap bootstrap-4 twitter-bootstrap-tooltip

【解决方案1】：

你的问题不够清楚。但是，我看到的一个原因是您在 SPAN 标记内有 ANCHOR 标记。因此，ANCHOR 标记消除了 SPAN 的 title 属性。要完成这项工作，您还需要将 title 属性添加到锚点。

看看这个：

<td data-container="body">

  <span data-placement="top" data-container="body" ng-if="!Plist.Active" data-toggle="tooltip" title="This Team list is inactive">

    Dummy text </br>
  <a title="This Team list is inactive" class="fa fa-exclamation-circle">This is anchor</a>
  </span> 

</td>

https://jsfiddle.net/milindbhatt3990/81a6dmtg/4/

【讨论】：