Twitter Bootstrap PopOver只适用于第一个触发器
问题描述:
我一直在使用Twitter Bootstrap构建网站的基本布局。我有一个需要显示的数据的表,其中每个订单项,我想表明作为一个流行过Twitter Bootstrap PopOver只适用于第一个触发器
数据属性,如:
<tr>
<td><a href="#" class="popover-test" id ="test" rel="popover"
data-content="Content 1: this shows fine!" data-original-title="Title 1">Hover for popover</a>
</td>
<td>two</td>
<td>three</td>
</tr>
<tr>
<td><a href="#" class="popover-test" id ="test" rel="popover"
data-content="Doesn't show :(" data-original-title="Title 2">Hover for popover</a>
</td>
<td>two</td>
<td>three</td>
</tr>
看起来虽然是流行过将只与列表中的第一个元素一起工作。看到这jsfiddle:http://jsfiddle.net/stycu/
有谁知道这是否是由设计或如果这是一个错误?我已经检查了github上的问题,但看不到任何涉及它的问题。
在此先感谢
答
$(function() {
$("#test").popover();
});
你被你的电话和IDS引用的#test
的ID必须是每个元素唯一的,因此在显示只有第一酥料饼。
改为使用属性选择器来定位弹出式属性或类的弹出式属性rel
。
$(function() {
$('[rel="popover"]').popover();
});
答
它只能与宝石 “Twitter的引导护栏”
在application.js中
$(document).ready(function() {
options = {
trigger : 'hover'
}
$('[rel="popover"]').popover(options);
});
鉴于
<tr>
<td><a href ="#" rel="popover" data-content="Content 1: this shows fine!" data-original-title="Title 1" >Hover for popover</a>
</td>
</tr>
<tr>
<td><a href ="#" rel="popover" data-content="Doesn't show :(" data-original-title="Title 2">Hover for popover</a>
</td>
</tr>
经过工作它我通过把这段代码放在http://jsfiddle.net/stycu/
干杯!感觉有点愚蠢,这是一个小学生的错误;) – GrahamJRoy 2012-03-20 14:19:12