TypeError: $(...).tooltip 不是函数答案

【问题标题】：TypeError: $(…).tooltip is not a functionTypeError: $(...).tooltip 不是函数
【发布时间】：2016-07-21 13:16:43
【问题描述】：

我来了

TypeError: $(…).tooltip 不是函数

在将 lightbox2 与 bootstrap 一起使用时，我正在初始化 tooltip() 函数的 jquery 文件中出现错误。

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

<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
        <script src="bootstrap/js/bootstrap.js"></script>
        <script src="main.js"></script>
</head>
<body>
  <script src="lightbox-plus-jquery.min.js"></script>
</body>

【问题讨论】：

bootstrap JS文件加载了吗？
检查你的控制台，这是TypeError: $(…).tooltip is not a function你看到的唯一错误吗？
某些 js 库的路径可能不正确？
我也试过 cdn @ganesh 但仍然没有摆脱这个错误

标签： jquery

【解决方案1】：

当 jQuery 被包含两次时会发生这种情况。

对于使用 Rails 的人，已经默认包含 jQuery（检查 app/assets/javascripts/application.js）：

//= require jquery

再次包含 jQuery，例如在app/views/layouts/application.html.erb 中带有<script> 标签，将导致此错误。

解决办法是去掉app/views/layouts/application.html.erb中的<script>标签。

【讨论】：

@NeerajRana 是的，但这在开始使用任何框架时都很常见。该框架会加载 jQuery，如果您正在集成来自另一个非框架项目的已经工作的代码，它可能还包括 jQuery。就我而言，它是在将一些非 Bootstrap 页面转换为使用 Bootstrap 时发生的。
我相信在使用像 PureChat 这样的聊天插件时也会发生这种情况。它加载自己的 JQuery。我相信 Bootstrap 将.tooltip() 添加到第一个（Rails）JQuery 中。加载第二个 JQuery 后，您将在 $(document) 和 turbolinks:load 事件中使用第二个 JQuery。第二个 JQuery 不知道 .tooltip()。通过注释掉 PureChat，问题就消失了。在使用if (typeof jqueryobject.tooltip === "function") 调用它之前，我将测试以验证该函数是否存在。
天哪！这是我唯一一次看到有人这么说，这是我的问题。呃，多么愚蠢的简单事情。谢谢！ +1

【解决方案2】：

我最喜欢的 jQuery UI 部分是 tooltip()，我经常忘记它并非一直存在于 jQuery UI 中。它是为 1.9 版添加的...

添加的版本：1.9（来源：API.jQueryUI.com: Tooltip Widget。）

如果您没有 1.9 或更高版本的 jQuery UI，您将收到错误消息：tooltip() is not a function()。

【讨论】：