twitter bootstrap工具提示在js模板中不起作用

Question

我正在使用twitter引导工具提示功能，该功能在gsp标头文本中可以正常工作。 现在，我想在id =“ tooltipcheck”上添加引导工具提示。 如果我写title =“ {{data}}”，那么我可以看到工具提示，但是引导工具提示似乎在这里不起作用。 js模板有任何问题还是其他问题？

<script id="myTemplate" type="text/x-handlebars-template">
<div class="row">
    <div class="span4" id="tooltipcheck" data-placement="bottom" data-toggle="tooltip"  data-original-title="{{data}}">{{data}} </div>
</div>

我这样称呼工具提示。

      <script>

jQuery(function ($) {
    $("#tooltipcheck").tooltip('show');

});

Answer 1

您无法设置模板中元素的ID，因为ID必须是唯一的。 尝试将tooltipcheck更改为一个类：

<div class="span4 tooltipcheck" data-placement="bottom" data-toggle="tooltip" data-original-title="{{data}}">{{data}} </div>

然后使用该类初始化您的工具提示：

$(".tooltipcheck").tooltip('show');

在车把解析了模板并生成标记后，将需要初始化工具提示，否则工具提示将没有任何元素要绑定。

Answer 2

由于您正在使用动态元素，因此在将元素添加到dom后，您需要为新元素初始化工具提示

例如：

var html = // html from template
var el = $(html).appendTo('somele');
el.find('<tooltip-element>').tooltip('show');

另外，由于您使用的是模板，所以我假设页面中会存在该模板的多个实例，因此请勿在模板内使用id ，因为在dom中，一个id仅应出现一次