Question

我一直遇到一些问题，让我的twitter引导程序在我的Django网站上正常工作。目前我的twitter bootstrap部分有效。

例如，我的HTML文件是：

    <!DOCTYPE html>
    {% load staticfiles %}

    <head>

    <link rel="stylesheet" href="{% static "bootstrap/css/bootstrap.min.css" %}" type="text/css" media="screen" /> 
    <script type="text/javascript" src="{% static "bootstrap/js/bootstrap.min.js" %}" ></script>

    </head>

    <html>
    <body>

    <span class="badge badge-success" >HI!</span>
    <span class="badge">1</span>
    <span class="badge badge-warning">4</span>
    <span class="badge badge-important">6</span>
    <span class="badge badge-info">8</span>
    <span class="badge badge-inverse">10</span>

    </body>
    </html>

此代码将显示徽章，但不会显示徽章的颜色。仅显示灰色徽章，每个徽章中都包含一些文本。我运行我的代码并使用FireBug进行检查，它说：

    Uncaught ReferenceError: jQuery is not defined                  bootstrap.min.js:6

我认为我在这个项目中缺少jQuery。

有人可以提供有关如何解决问题的分步过程吗？我是网络开发的新手。感谢您的所有输入！非常感谢！

Answer 1

您需要拥有jquery库才能让bootstrap正常运行。

插件依赖项

某些插件和CSS组件依赖于其他插件。如果你   单独包含插件，请务必检查这些插件   文档中的依赖项。另请注意，所有插件都依赖于jQuery   （这意味着必须在插件文件之前包含jQuery）。

把这个

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

行前

<script type="text/javascript" src="{% static "bootstrap/js/bootstrap.min.js" %}" ></script>

此外，Bootstrap 3上没有badge-success这样的东西。也许你使用的是错误的版本

Answer 2

我假设我在这个项目中缺少jQuery。你的假设是完全正确的，所以解决方案是包含jQuery（就像你包含了Bootstrap脚本一样）。
您可以从某个CDN（内容交付网络）引用特定版本的jQuery，然后您的访问者可能已经缓存了此文档，并且他们可以节省一个http请求（您的服务器也可以）。如果您选择从此类提供程序引用脚本，我强烈建议您不要使用//code.jquery.com/jquery-latest.min.js之类的内容，因为最新版本会不时发生变化，因此您必须确保所有内容仍在使用较新版本版本。
当然，您也可以下载特定版本的jQuery，并像使用Bootstrap脚本一样包含它，只需确保在后者之前包含它。您可以考虑在页面末尾包含脚本，因此加载它们不会阻止加载页面的其余部分。

Answer 3

jQuery不包含在bootstrap.min.js文件中，您必须按照此处所述添加它：http://getbootstrap.com/getting-started/#template。

如果您在另一个js文件中使用jQuery和Bootstrap js文件的功能，请不要忘记在jQuery和Bootstrap之后包含您的js文件。

我建议将您的javascript文件放在页面的末尾，如引导示例中所示的标记之前。 JavaScript文件可能会非常繁重，并且会减慢加载页面的时间，这就是您将它们放在最后的原因。

bootstrap.min.js 3.0.0中缺少jQuery

3 个答案: