问题
While using Jinja templates, Bootstrap modals do not show properly. Either they show without disabling the background or they show disabled (and can't be closed). Including a CSS z-index didn't work. Changing the JavaScript code to open the modal manually didn't work.
回答1:
All modals need to be placed outside of your <body>. If you place the modals inside of your main jinja2 {%block content%}, they have a tendency to behave oddly. Try the following:
template.html- this is your main jinja2 template
<!DOCTYPE html>
<html lang="en">
<head>
enter code here
</head>
<body>
{% block content %}
{% endblock %}
</body>
{%block modals%}
{%endblock%}
</html>
Then on your child page, include the html below at the bottom of the page, after {%endblock content%}:
{%block modals%}
<!-- Your modals go here -->
{%endblock%}
来源：https://stackoverflow.com/questions/57658148/bootstrap-modals-not-showing-correctly-when-using-jinja-templates