Uncaught ReferenceError: $ не определено - ошибка в консоли

Question

Я получаю эту ошибку в своей консоли, и это связано с js-скриптом, который я использую (Trumbowyg WYSIWYG: http://alex-d.github.io/Trumbowyg/)

Вот изображение консоли браузера с ошибкой:

Когда я нажимаю на (index):166, это показывает это в источнике:

id_content это id для редактора WSYIWYG, и это обязательная функция в моем js файл, чтобы он работал:

$('#id_content').trumbowyg({

});

Я посмотрел на другие решения, и они говорят, чтобы загрузить сценарий jquery перед каждым другим сценарием js, но я уже делаю это, и это ничего не решает. Кто-нибудь знает, в чем проблема? Кстати, я использую этот пакет для интеграции его с django: https://github.com/sandino/django-trumbowyg, не уверен, что это что-то изменит. Я просто загружаю виджет в моих формах так:

class PostForm(forms.ModelForm):
    content = forms.CharField(widget=TrumbowygWidget(), required=False)

полная HTML-часть:

< div >
< textarea
cols = "40"
id = "id_content"
name = "content"
rows = "10" >
< / textarea >
< script >
$("#id_content").trumbowyg({
    lang: "en",
    semantic: true,
    resetCss: true,
    autogrow: true,
    removeformatPasted: true,
    btnsDef: {
        image: {
            dropdown: ['upload', 'insertImage', 'base64', 'noembed'],
            ico: 'insertImage'
        }
    },
    btns: [
        ['formatting'],
        'btnGrp-semantic',
        ['link'],
        ['image'],
        'btnGrp-justify',
        'btnGrp-lists',
        'video',
        ['horizontalRule'],
        ['removeformat'],
        ['fullscreen'],
        ['viewHTML']
    ],
    plugins: {
        upload: {
            serverPath: '/trumbowyg/upload_image/',
            fileFieldName: 'image',
            statusPropertyName: 'message',
            urlPropertyName: 'file'
        }
    }
});
< / script >

< / div >

РЕДАКТИРОВАТЬ: имейте в виду, что все работает нормально, но я все еще получаю эту ошибку. Это не повторяющийся вопрос, я пробовал эти решения, и ни одно из них не работает.

конец html файла, загрузка скриптов в порядке:

    ...
    <script src="//ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <script>window.jQuery || document.write('<script src="js/vendor/jquery-3.1.1.min.js"><\/script>')</script>
    <script src="/static/js/jquery-jvectormap-2.0.3.min.js"></script>
    <script src="http://jvectormap.com/js/jquery-jvectormap-world-mill.js"></script>
    <script type="text/javascript" src="/static/js/base.js"></script>
    <!--<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/marked/0.3.6/marked.min.js"></script>-->
    <script src="/static/js/Trumbowyg-master/dist/trumbowyg.js"></script>

</body>

Answer 1

Это означает, что на вашей странице не загружен jQuery.

Проверьте вкладку сети, чтобы увидеть, были ли проблемы с загрузкой в ​​jQuery.

Или же

Убедитесь, что ваш код выполняется после включения jQuery.