0

让我的 twitter 引导程序在我的 Django 网站上正常工作时,我遇到了一些问题。目前我的推特引导程序部分有效。

例如,我的 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。

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

4

3 回答 3

1

你需要有jquery库才能让引导程序正常运行。

插件依赖

一些插件和 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。也许你使用的版本错误

于 2013-09-10T09:15:44.733 回答
1

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

于 2013-09-10T09:25:34.387 回答
0

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

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

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

于 2013-09-10T09:17:37.763 回答