Bootstrap4工具提示不适用于Flask web应用程序

我已经创建了安装了引导插件的Flask应用程序。但是引导页面中显示的工具提示不起作用。 我尝试了在网上找到的所有东西，但仍然没有成功

我正在使用Python3.7和docker compose构建应用程序。 已安装以下插件：

Flask==1.0.3
flask-restful==0.3.7
Flask-Bootstrap4==4.0.2
flask-nav==0.6

在我的应用程序中，我现在使用的是Flask和Flask-Bootstrap4

我正在使用模板加载子页面。我的布局如下（layout.html）：

{%extends“bootstrap/base.html”%}
{%block navbar%}




{%endblock导航栏%}
{%block content%}
{%endblock内容%}

您看到的是默认的html工具提示，而不是引导提示。这可能是脚本加载的顺序，请尝试移动脚本

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

$（函数（）{
$（'[data toggle=“tooltip”]'）。tooltip（）
})

---

加载jquery/bootstrap脚本之后/之后（我猜这将出现在你的layout.html中）

@Dylanj多亏了你的回答，我找到了另一种工作方式

我想我可以从以下位置从引导包本地加载css：

root@9949973a7f22:/usr/local/lib/python3.7/site-packages/flask_bootstrap/static/css# ls -al
total 1696
drwxr-sr-x 2 root staff   4096 Jul 17 16:16 .
drwxr-sr-x 6 root staff   4096 Jul 17 16:16 ..
-rw-r--r-- 1 root staff  43852 Jul 17 16:16 bootstrap-grid.css
-rw-r--r-- 1 root staff  95910 Jul 17 16:16 bootstrap-grid.css.map
-rw-r--r-- 1 root staff  34243 Jul 17 16:16 bootstrap-grid.min.css
-rw-r--r-- 1 root staff  76209 Jul 17 16:16 bootstrap-grid.min.css.map
-rw-r--r-- 1 root staff   4798 Jul 17 16:16 bootstrap-reboot.css
-rw-r--r-- 1 root staff  57721 Jul 17 16:16 bootstrap-reboot.css.map
-rw-r--r-- 1 root staff   3936 Jul 17 16:16 bootstrap-reboot.min.css
-rw-r--r-- 1 root staff  25881 Jul 17 16:16 bootstrap-reboot.min.css.map
-rw-r--r-- 1 root staff 178152 Jul 17 16:16 bootstrap.css
-rw-r--r-- 1 root staff 411645 Jul 17 16:16 bootstrap.css.map
-rw-r--r-- 1 root staff 144877 Jul 17 16:16 bootstrap.min.css
-rw-r--r-- 1 root staff 551641 Jul 17 16:16 bootstrap.min.css.map
-rw-r--r-- 1 root staff  35359 Jul 17 16:16 fontawesome-all.min.css
-rw-r--r-- 1 root staff  33994 Jul 17 16:16 fontawesome.min.css

---

但是如何在layout.html中导入bootstrap.min.css和fontawesome-all.min.css？

我通过在Flask app行中添加以下内容解决了本地加载引导内容的问题：

app.config['BOOTSTRAP_SERVE_LOCAL'] = True

我也读过剧本：

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

$（函数（）{
$（'[data toggle=“tooltip”]'）。tooltip（）
})

应该在引导脚本之后加载

---

你能告诉我怎么做吗？

我通过在%content%部分添加脚本解决了这个问题

感谢dylanj.nz的提示，帮助我找到了解决方案

现在，my layout.html如下所示：

{%extends“bootstrap/base.html”%}
{%block navbar%}






{%endblock导航栏%}
{%block content%}
{%block scripts%}
{{super（）}}
$（函数（）{
$（'[data toggle=“tooltip”]'）。tooltip（）
})
{%endblock脚本%}
{%endblock内容%}

我试着把。。。在layout.html的许多位置，它仍然不起作用。我把这个放在了乞讨处和这一节的末尾。我还把它放到{%block-navbar%}。当我把。。。在{%block content%}中，我通过检查代码看不到这一点。当您从开发工具控制台（

$（'[data toggle=“tooltip”]'）调用初始化时，tooltip（）

），它会起作用吗？加载页面后是否出现任何控制台错误？我将。。。在home.html中，转到代码检查->控制台，发现一个错误：home:16 GET net:：ERR_中止403（禁止）home:53未捕获引用错误：$未在home:53（匿名）@home:53中定义。我想知道为什么会出现这个错误？为什么它从引导服务器下载引导内容而不是从Docker中安装的引导模块？