Bootstrap Tooltip Not Displaying

Question

我正在尝试使用引导工具提示 - 但目前我无法让它们显示。我遵循了Bootstrap Docs指南中的所有说明，但它们仍然无法正常工作。有什么我可能会失踪？

HTML：

<button class="btn btn-white btn-sm" data-toggle="tooltip" data-placement="left" title="Refresh inbox"><i class="fa fa-refresh"></i> Refresh</button> 
<button class="btn btn-white btn-sm" data-toggle="tooltip" data-placement="top" title="Mark as read"><i class="fa fa-eye"></i> </button> 
<button class="btn btn-white btn-sm" data-toggle="tooltip" data-placement="top" title="Mark as important"><i class="fa fa-exclamation"></i> </button> 
<button class="btn btn-white btn-sm" data-toggle="tooltip" data-placement="top" title="Move to trash"><i class="fa fa-trash-o"></i> </button> 

JS：

$(function() { 
      $('[data-toggle="tooltip"]').tooltip() 
}) 

和代码笔可以在这里找到： http://codepen.io/anon/pen/LpzPxR

我最初的猜测是，什么是错的CSS 但我似乎无法让它在笔中工作。

编辑：我已经解决了该问题在codepen但实际模板仍显示错误 - http://i62.tinypic.com/2ik2u6s.jpg

Answer 1

就快：你只是缺少了jQuery，bootstrap.js之前。

从引导文件：

一些插件和CSS组件依赖于其他插件。如果您单独包含插件，请确保在文档中检查这些依赖关系。另外请注意，所有的插件依赖jQuery的（这意味着jQuery的必须的插件文件之前包括在内）

见forked codepen

注：我还添加了font-awesome.css你有从后者库图标。

---

编辑：从this screenshot张贴在评论和谈话，似乎也OP有jQuery UI Tooltip，这是与引导提示冲突。