我有这部分 JavaScript(jQuery 代码)
instance.on(dragLinks, "click", function(e) {
var s = instance.toggleDraggable(this.getAttribute("rel"));
this.innerHTML = (s ? '<a href="#" class="cmdLink drag" style="margin-right: 3px;"> <span class="glyphicon glyphicon-remove-sign" title="disable dragging" style="font-size: 15px;"> </span> </a>' : '<a href="#" class="cmdLink drag" style="margin-right: 3px;"> <span class="glyphicon glyphicon-ok-sign" title="enable dragging" style="font-size: 15px;"> </span> </a>');
jsPlumbUtil.consume(e);
});
以“this.innerHTML”开头的行在单击元素(图标)后对其进行更改。正如您所看到的,它是 bootstrap 3.0 字形。
我有关于它们的工具提示
$(".glyphicon-remove-sign").tooltip({
placement: 'bottom',
});
$(".glyphicon-ok-sign").tooltip({
placement: 'bottom',
});
加载应用程序后,首先显示 glyphicon-remove-sign 图标。 Bootstrap 3.0 工具提示也正确显示。但是,问题是,点击它们后,不再有 Bootstrap 3.0 的工具提示效果,只有糟糕的 HTML 工具提示。如何解决这个问题?
最佳答案
根据 Bootstrap 网站,“工具提示和弹出数据 API 是可选的,这意味着您必须自己初始化它们。”
因此,为了实现您的目标,必须重新初始化 Bootstrap 工具提示,正如 Miraage 所提到的。
这是一个很好的教程,可能会有所帮助:
http://www.tutorialrepublic.com/twitter-bootstrap-tutorial/bootstrap-tooltips.php
希望这有帮助!
关于javascript - 如何在更改元素后保留 Bootstrap 工具提示?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26956704/