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僅應出現一次