引导程序将工具提示添加到下拉列表中
Bootstrap add tooltip to dropdown
我正在尝试向Bootstrap添加工具提示,尝试了互联网上的所有解决方案,但没有任何帮助。这是我的下拉列表(我也使用String和jstl标签):
<div class="btn-group" style="margin-bottom:5px; width: 100%;">
<a id="tableNameButton" data-placement="bottom" title="Text" class="my-tooltip my-dropdown tableNameButton btn btn-default btn-block btn-select" data-toggle="dropdown" href="#">Select table <span class="caret"></span></a>
<form:input class="form-control" id="tableNameFormId" path="tableName" style="visibility: hidden; display: none;" />
<ul id="tableName" class="dropdown-menu scrollable-menu">
<c:forEach items="${databaseTables}" var="databaseTable">
<li><a href="#">${databaseTable}</a></li>
</c:forEach>
</ul>
</div>
在javascript上:
$('.my-dropdown').dropdown();
$('.my-dropdown').tooltip();
这东西不管用。希望有人已经解决了这个问题,提前谢谢。
检查是否已正确链接所有内容并包含bootstrap.js文件。我已经用你的代码设置了一个JSFIDDLE,工具提示有效:
http://jsfiddle.net/shannabarnard/ueoxmm9v/
<div class="btn-group" style="margin-bottom:5px; width: 100%;">
<a id="tableNameButton" data-placement="bottom" title="Text" class="my-tooltip my-dropdown tableNameButton btn btn-default btn-block btn-select" data-toggle="dropdown" href="#">Select table <span class="caret"></span></a>
<form:input class="form-control" id="tableNameFormId" path="tableName" style="visibility: hidden; display: none;" />
<ul id="tableName" class="dropdown-menu scrollable-menu">
<c:forEach items="${databaseTables}" var="databaseTable">
<li><a href="#">${databaseTable}</a></li>
</c:forEach>
</ul>
</div>
JS-
$('.my-dropdown').dropdown();
$('.my-tooltip').tooltip();
我想它不起作用,因为您没有添加数据属性,如数据切换和数据放置。尝试添加它们,我认为它会起作用。
参见fiddle with working example:http://jsfiddle.net/h56xw8wq/1/
你应该有类似的smth
<li class="dropdown" id="example" data-toggle="tooltip" data-placement="bottom" title="Tooltip on bottom" > ... </li>
希望它能帮助你:)
相关文章:
- jQuery表单添加不适用于下拉列表
- 在play2框架中向json对象添加下拉列表项
- 如何为下拉列表的每个选项添加一个属性
- 下拉列表没有'当添加'要求'到'敲除'
- 如果没有从下拉列表中选择任何值,则允许使用php、mysql、javascript将文本框添加到mysql表中
- 将文本框/单选按钮/和下拉列表中的信息添加到dataTable
- webforms:在javascript中动态添加下拉列表选项
- 将幻灯片效果添加到引导下拉列表
- 角度 - 需要向选择下拉列表添加多个占位符
- 如何使用 JavaScript 将下拉列表添加到<跨度>
- 可以通过Javascript将选择下拉列表添加到我的winJS工具栏中吗?
- 使用下拉列表添加/删除搜索框
- 如何在jQuery中向不同的下拉列表添加不同的前缀
- 单击按钮将下拉列表添加到新行
- 在使用javascript向下拉列表添加项目并运行服务器端代码后,无效的回发或回调参数
- 使用jQuery为下拉列表添加选项
- 为动态创建的下拉列表添加单击功能
- 将多个下拉列表添加到用数据库值填充的表中
- 使用jQuery向下拉列表添加选项
- 从javascript函数向下拉列表添加名称列表