Вызов внешней функции Javascript в html с использованием колбы, показывающий, что функция не определена - PullRequest
0 голосов
/ 03 апреля 2019

Я использую колбу в {% extends "base.html"%} и вставляю {% block js_file%}, затем я вызываю функции, определенные в файле .js, но получаю uncaught referenceerror не определено. У меня есть 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>
    ....

затем на определенной странице с именем mark.html я сначала расширяю и вставляю элементы и хочу проверить функцию в отдельном файле functions.js:

{% extends "base.html" %}
{% block cssfile %}
    <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='mark.css') }}">
{% endblock %}

{% block title %}
    Mark
{% endblock %}

{% block js_files %}
    <script src="https://code.jquery.com/jquery-3.3.1.js" integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60=" crossorigin="anonymous">
    <script src="{{ url_for('static', filename='functions.js') }}"></script>
{% endblock %}

{% block content %}
    ....
    <script>warn();</script>
    ....
{% endblock content %}

functions.js имеет только функцию тестирования:

function warn(){
    alert('fired');
};

В конце концов, в Chrome Dev Tools конечная страница выглядит как

<!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>
    ....

Структура выглядит хорошо для меня, но это необъяснимый. Errorer не определен. Я новичок в web div, поэтому этот вопрос может быть глупым, но я ценю любую помощь!

1 Ответ

0 голосов
/ 03 апреля 2019

Я понял, это связано с порядком загрузки.Потому что я использую {% extends "base.html" %} и вставляю {% block js_file%}, поэтому порядок сбивает с толку.Я справился с этим, имея надлежащие ссылки в base.html, потому что именно отсюда все расширяется, поэтому он наверняка загрузится первым.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...