这是我的HTML代码:
<table>
<tr class="primary">
<td>1</td>
<td>Name</td>
<td>
<a data-toogle="tooltip" data-placement="bottom" title="Add user" href="#/tutoria/add/1" class="glyphicon glyphicon-plus glyphicon-lg **tooltips** add-user" data-original-title="Agregar usuario"></a>
</td>
</tr>
<--!The last tooltip that I've in my table (tr) doesn't work-->
<tr class="primary">
<td>2</td>
<td>Name</td>
<td>
<a data-toogle="tooltip" data-placement="bottom" title="Add user" href="#/tutoria/add/2" class="glyphicon glyphicon-plus glyphicon-lg **tooltips** add-user"></a>
</td>
</tr>
</table>
JS代码:
$(".tooltips").tooltip();
我正在使用Backbone实现Bootstrap并且我遇到了这个问题:所有工具提示(Bootstrap)工作正常,除非我在表格的最后一行中提供了工具提示。
答案 0 :(得分:0)
表格中的最后一个工具提示缺少data-original-title
标记。您已将其包含在第一个工具提示中,这就是为什么它正在工作的原因。
更改您的代码:
<a data-toogle="tooltip" data-placement="bottom" title="Add user" href="#/tutoria/add/2" class="glyphicon glyphicon-plus glyphicon-lg **tooltips** add-user">
为:
<a data-toogle="tooltip" data-placement="bottom" title="Add user" href="#/tutoria/add/2" class="glyphicon glyphicon-plus glyphicon-lg **tooltips** add-user" data-original-title="tooltipcontenthere">
答案 1 :(得分:0)
你给的代码,应该工作,它的工作原理,我尝试在chrome,firefox,IE上,我可以复制你的代码,但它与你的相同,除非在最后一个引号之前有另一个代码未关闭,阻止jquery将最后一个'a'识别为“.tooltips”选择器的一部分
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="js/bootstrap/css/bootstrap.min.css">
<!-- Optional theme -->
<link rel="stylesheet" href="js/bootstrap/css/bootstrap-theme.min.css">
<!-- Latest compiled and minified JavaScript -->
<script src="js/bootstrap/js/bootstrap.min.js"></script>
<script>
$(".tooltips").tooltip();
</script>
<html>
<body>
<table>
<tr class="primary">
<td>1</td>
<td>Name</td>
<td>
<a data-toogle="tooltip" data-placement="bottom" title="Add user" href="#/tutoria/add/1" class="glyphicon glyphicon-plus glyphicon-lg **tooltips** add-user" data-original-title="Agregar usuario"></a>
</td>
</tr>
<--!The last tooltip that I've in my table (tr) doesn't work-->
<tr class="primary">
<td>2</td>
<td>Name</td>
<td>
<a data-toogle="tooltip" data-placement="bottom" title="Add user" href="#/tutoria/add/2" class="glyphicon glyphicon-plus glyphicon-lg **tooltips** add-user"></a>
</td>
</tr>
</table>
</body>
</html>
使用chrome调试器知道你何时使用选择器'.tooltips'是jquery选择最后一个'a'?
答案 2 :(得分:0)
我刚刚添加了
<script src="http://getbootstrap.com/assets/js/docs.min.js"></script>
在bootstrap.min.js下面,它可以工作。