在本地使用 jQuery 和 Bootstrap for Django 不会响应

Posted 2023-05-08

【中文标题】在本地使用 jQuery 和 Bootstrap for Django 不会响应

【英文标题】：Using jQuery locally with Bootstrap for Django wont respond

【发布时间】：2021-11-05 16:50:08

【问题描述】：

我的base.html 文件中有这个

% load bootstrap4 %
% bootstrap_css %
% bootstrap_javascript jquery='full' %

我正在使用来自 Bootstrap 的 navbar navbar-expand-lg navbar-light 作为我的 navbar。 这是有效的。当我使用小型显示器（如智能手机）时，它会将菜单缩小为下拉元素，并带有一个展开按钮。

但是% bootstrap_javascript jquery='full' % 部分需要很长时间才能从网络完全加载 jquery 源： 大约 400ms 没有缓存。我想尽可能地失去这个等待时间。 所以我从官方网站下载了最新的jquery 3.6.0，并将其保存在我的静态文件中，例如

static/main_app/scripts/jQuery.js

在本地加载它

<script type="text/javascript" src="% static 'main_app/scripts/jQuery.js' %"></script> 在我的base.html。这行得通，jQuery 工作正常。但是 Bootstrap 的 nav-bar 按钮没有响应。 浏览器的控制台也没有错误信息。

所以我虽然：也许 jQuery 版本是错误的？ 所以我尝试在我的网站上再次实施工作版本

% bootstrap_javascript jquery='full' %

，在浏览器的开发工具中查找上述文件的源代码，将源代码复制并粘贴到我的jQuery.js 文件中，然后再次加载该站点。没有任何改变，navbar 仍然无法正常工作。

我有什么遗漏吗？

*** 更新 ***

当我设置时它工作

    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js" integrity="sha384-B4gt1jrGC7Jh4AgTPSdUtOBvfO8shuf57BaghqFfPlYxofvL8/KUEfYiJOMMV+rV" crossorigin="anonymous"></script>

但有

% load bootstrap4 %

这意味着我正在加载 bootstrap 两次...

【参考方案1】：

我能够像这样将 CDN 中的 BOOTSTRAP4 pip 包设置（jquery 调用）覆盖到 settings.py 中的本地文件

BOOTSTRAP4 = 
    "jquery_url": 
            "url": f"STATIC_URLmain_app/scripts/jquery.js",
    ,

here 也是另一个覆盖选项