使用flask调用html中的外部Javascript函数，显示未定义的函数_Javascript_Html_Flask

使用flask调用html中的外部Javascript函数，显示未定义的函数

javascript html flask

使用flask调用html中的外部Javascript函数，显示未定义的函数,javascript,html,flask,Javascript,Html,Flask,我正在使用flask来{%extends“base.html”%}并插入{%block js_file%}，然后我调用在.js文件中定义的函数，但接收未捕获的引用错误未定义。我有一个base.html，包含所有页面中的所有基本元素。看起来像 <!DOCTYPE html> <html> <head> <title> {% block title %}{% endblock %} &l

我正在使用flask来{%extends“base.html”%}并插入{%block js_file%}，然后我调用在.js文件中定义的函数，但接收未捕获的引用错误未定义。 我有一个base.html，包含所有页面中的所有基本元素。看起来像

<!DOCTYPE html>
<html>
    <head>
        <title>
            {% block title %}{% endblock %}
        </title>
        <!--css file code-->
        {% block cssfile %}{% endblock %}
        <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='header.css') }}">
    </head>
    <body> 
        ...
         {% block content %}{% endblock %}
         ...
         {% block js_files %}{% endblock %}
    </body>
    ....

<!DOCTYPE html>
<html>
    <head>
        <title>
            Mark
        </title>
        <!--css file code-->
        <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='mark.css') }}">
        <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='header.css') }}">
    </head>
    <body> 
        ...
         <script>warn();</script>
         ...
         <script src="https://code.jquery.com/jquery-3.3.1.js" integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60=" crossorigin="anonymous">
        </script>
        <script src="/static/functions.js"></script>
    </body>
    ....

最后，在Chrome开发工具中，entended页面看起来像

<!DOCTYPE html>
<html>
    <head>
        <title>
            {% block title %}{% endblock %}
        </title>
        <!--css file code-->
        {% block cssfile %}{% endblock %}
        <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='header.css') }}">
    </head>
    <body> 
        ...
         {% block content %}{% endblock %}
         ...
         {% block js_files %}{% endblock %}
    </body>
    ....

<!DOCTYPE html>
<html>
    <head>
        <title>
            Mark
        </title>
        <!--css file code-->
        <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='mark.css') }}">
        <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='header.css') }}">
    </head>
    <body> 
        ...
         <script>warn();</script>
         ...
         <script src="https://code.jquery.com/jquery-3.3.1.js" integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60=" crossorigin="anonymous">
        </script>
        <script src="/static/functions.js"></script>
    </body>
    ....


做记号
...
警告（）；
...
....

该结构在我看来很好，但它的未捕获引用错误未定义。我是新来的网络部门，所以这个问题可能是愚蠢的，但我感谢任何帮助

我想，这与装载顺序有关。因为我使用了

{%extends“base.html”%}

并插入了{%block js_file%}，所以顺序很混乱。我通过在base.html中添加适当的链接来解决这个问题，因为所有内容都是从base.html扩展而来的，所以它肯定会首先加载。

我想，这与加载顺序有关。因为我使用了

{%extends“base.html”%}

并插入了{%block js_file%}，所以顺序很混乱。我通过在base.html中添加适当的链接来解决这个问题，因为所有内容都是从base.html扩展而来的，因此它肯定会首先加载。

您是否尝试在html正文之前导入Jquery？ie刚导入了你的样式表？我想，这与加载订单有关。因为我使用`{%extends“base.html”%}`并插入

{%block js_file%}

，所以顺序很混乱。我通过在

base.html

中设置适当的链接来解决这个问题，因为所有内容都是从那里扩展的，所以它肯定会首先加载。您是否尝试在html正文之前导入Jquery？ie刚导入了你的样式表？我想，这与加载订单有关。因为我使用`{%extends“base.html”%}`并插入

{%block js_file%}

，所以顺序很混乱。我通过在

base.html

中设置适当的链接来解决这个问题，因为所有内容都是从这里扩展的，所以它肯定会首先加载。