我在用bootstrap。我想在带有工具提示的表单文本中放置一个字形图标。我可以将glyphicon放在表单文本的右侧,但工具提示不起作用。
有什么想法吗?
这是html

<div class="right-inner-addon table-error">
  <a>
    <i class="glyphicon glyphicon-exclamation-sign red" data-toggle="tooltip" title="Campo obrigatório."></i>
    <input class="form-control" type="text"/>
  </a>
</div>

和我的css
.right-inner-addon {
    position: relative;
}
.right-inner-addon input {
    padding-right: 30px;
}
.right-inner-addon i {
    position: absolute;
    right: 0px;
    padding: 8px 10px;
    pointer-events: none;
}

最佳答案

重新阅读你的问题,这里有一个更新。
工具提示本身不会显示,您必须初始化它们。以下是他们documentation中的简介
出于性能原因,工具提示和Popover数据api是可选的,
意思是你必须自己初始化它们。
要初始化它们,请遵循下面的JS代码片段。
此外,您的代码还具有CSS属性:

.right-inner-addon i {
    position: absolute;
    right: 0px;
    padding: 8px 10px;
    /* pointer-events: none;  <!-- remove this line */
}

您需要删除它,因为这会阻止工具提示的触发器。您还需要指定data-placement属性(右、左等),因为它已丢失。
参见跑步example here (fiddle)
JS公司
$(function () {
    $('[data-toggle="tooltip"]').tooltip({
        'html': true
    })
});

07-24 09:37
查看更多