jQuery UI 工具提示应显示 Div 而不是 title 属性

Question

如何使用 jQuery UI 工具提示根据给定属性(标题属性除外)动态显示 Div 容器？

fiddle 示例将显示我的问题:

<强> Example Fiddle

我有不同的链接，它们也可以有标题属性，如果有给定的属性，工具提示应该读取该值并显示贡献的 Div。

示例:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span class="toolTipHTML" data-ttcontent="help1_content" title="test 1">Help 1</span>
<span class="toolTipHTML" data-ttcontent="help2_content" title="test 2">Help 2</span>

<div class="help1_content">
  Text for Help 1 goes here!
  <br>Lorem
  <br>Ipsum
</div>

<div class="help2_content">
  Text for Help 1 goes here!
  <br>Lorem
  <br>Ipsum
</div>

目前它只显示标题属性，这是标准行为。但我想以这种方式更改调用，这样我就可以在工具提示中看到 Div(Div 在此示例中仅包含文本，但实际上可能要复杂得多)。

Answer 1

<强> Updated fiddle 。

您可以使用 content 选项来实现此目的:

$('.toolTipHTML').tooltip({
  show: { duration: 0 },
  hide: { effect: "fade", duration: 100 },
  position: { my: "left top", at: "left bottom" },
  content: function() {
    return $('.'+$( this ).attr('data_ttcontent')+'_content').html();
  }
});

希望这有帮助。