И jQuery, и $ не являются функцией

Я уже импортировал

<script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

под головной частью. Но все же я получил,

RelatedObjectLookups.js:142 Uncaught TypeError: $ is not a function
    at RelatedObjectLookups.js:142
    at RelatedObjectLookups.js:175
(anonymous) @ RelatedObjectLookups.js:142
(anonymous) @ RelatedObjectLookups.js:175
(index):177 Uncaught TypeError: $ is not a function
    at (index):177

Соответствующий html выглядит так,

<head>

    <script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


    <script crossorigin = "anonymous" integrity = "sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" src = "https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"></script>
<script crossorigin = "anonymous" integrity = "sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" src = "https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
    <link crossorigin = "anonymous" href = "https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity = "sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" rel = "stylesheet"> 
</head>
<body>
<script type = "text/javascript" src = "/admin/jsi18n/"></script>
<script type = "text/javascript" src = "/static/admin/js/core.js"></script>
<script type = "text/javascript" src = "/static/admin/js/admin/RelatedObjectLookups.js">        </script>

<script type = "text/javascript" src = "/static/admin/js/jquery.init.js"></script>
<script type = "text/javascript" src = "/static/admin/js/actions.min.js"></script>
<script type = "text/javascript" src = "/static/admin/js/calendar.js"></script>
<script type = "text/javascript" src = "/static/admin/js/admin/DateTimeShortcuts.js"></script> 
{{form.media}}
<div class = "row">
    <div class = "col-6">
        <form method = "post" id = "extendTrialForm" class = "form">
            {% csrf_token %}
            {% bootstrap_field form.user %}
            {% bootstrap_field form.core_instance %}
            {% bootstrap_field form.expiry_datetime %}
            {% buttons %}
                <button type = "submit" class = "btn btn-primary">Submit</button>
            {% endbuttons %}
        </form>
    </div>
</div>

<script>

$( document ).ready(function() { // line no 177

Удаление тегов сценария выше {{form.media}} не вызовет никаких ошибок, связанных с jquery, но не будет работать с виджетами. Мне нужны эти теги сценария, но я не хочу, чтобы JQuery возвращал $, это не функция. Я пробовал добавить $.noconflict, jQuery(document).ready, но ничего не работает.

RelatedObjectsLookups.js

/*global SelectBox, interpolate*/
// Handles related-objects functionality: lookup link for raw_id_fields
// and Add Another links.

(function($) {
    'use strict';

    // IE doesn't accept periods or dashes in the window name, but the element IDs
    // we use to generate popup window names may contain them, therefore we map them
    // to allowed characters in a reversible way so that we can locate the correct
    // element when the popup window is dismissed.
    function id_to_windowname(text) {
        text = text.replace(/\./g, '__dot__');
        text = text.replace(/\-/g, '__dash__');
        return text;
    }

    function windowname_to_id(text) {
        text = text.replace(/__dot__/g, '.');
        text = text.replace(/__dash__/g, '-');
        return text;
    }

    function showAdminPopup(triggeringLink, name_regexp, add_popup) {
        var name = triggeringLink.id.replace(name_regexp, '');
        name = id_to_windowname(name);
        var href = triggeringLink.href;
        if (add_popup) {
            if (href.indexOf('?') === -1) {
                href += '?_popup=1';
            } else {
                href += '&_popup=1';
            }
        }
        var win = window.open(href, name, 'height=500,width=800,resizable=yes,scrollbars=yes');
        win.focus();
        return false;
    }

    function showRelatedObjectLookupPopup(triggeringLink) {
        return showAdminPopup(triggeringLink, /^lookup_/, true);
    }

    function dismissRelatedLookupPopup(win, chosenId) {
        var name = windowname_to_id(win.name);
        var elem = document.getElementById(name);
        if (elem.className.indexOf('vManyToManyRawIdAdminField') !== -1 && elem.value) {
            elem.value += ',' + chosenId;
        } else {
            document.getElementById(name).value = chosenId;
        }
        win.close();
    }

    function showRelatedObjectPopup(triggeringLink) {
        return showAdminPopup(triggeringLink, /^(change|add|delete)_/, false);
    }

    function updateRelatedObjectLinks(triggeringLink) {
        var $this = $(triggeringLink);
        var siblings = $this.nextAll('.change-related, .delete-related');
        if (!siblings.length) {
            return;
        }
        var value = $this.val();
        if (value) {
            siblings.each(function() {
                var elm = $(this);
                elm.attr('href', elm.attr('data-href-template').replace('__fk__', value));
            });
        } else {
            siblings.removeAttr('href');
        }
    }

    function dismissAddRelatedObjectPopup(win, newId, newRepr) {
        var name = windowname_to_id(win.name);
        var elem = document.getElementById(name);
        if (elem) {
            var elemName = elem.nodeName.toUpperCase();
            if (elemName === 'SELECT') {
                elem.options[elem.options.length] = new Option(newRepr, newId, true, true);
            } else if (elemName === 'INPUT') {
                if (elem.className.indexOf('vManyToManyRawIdAdminField') !== -1 && elem.value) {
                    elem.value += ',' + newId;
                } else {
                    elem.value = newId;
                }
            }
            // Trigger a change event to update related links if required.
            $(elem).trigger('change');
        } else {
            var toId = name + "_to";
            var o = new Option(newRepr, newId);
            SelectBox.add_to_cache(toId, o);
            SelectBox.redisplay(toId);
        }
        win.close();
    }

    function dismissChangeRelatedObjectPopup(win, objId, newRepr, newId) {
        var id = windowname_to_id(win.name).replace(/^edit_/, '');
        var selectsSelector = interpolate('#%s, #%s_from, #%s_to', [id, id, id]);
        var selects = $(selectsSelector);
        selects.find('option').each(function() {
            if (this.value === objId) {
                this.textContent = newRepr;
                this.value = newId;
            }
        });
        win.close();
    }

    function dismissDeleteRelatedObjectPopup(win, objId) {
        var id = windowname_to_id(win.name).replace(/^delete_/, '');
        var selectsSelector = interpolate('#%s, #%s_from, #%s_to', [id, id, id]);
        var selects = $(selectsSelector);
        selects.find('option').each(function() {
            if (this.value === objId) {
                $(this).remove();
            }
        }).trigger('change');
        win.close();
    }

    // Global for testing purposes
    window.id_to_windowname = id_to_windowname;
    window.windowname_to_id = windowname_to_id;

    window.showRelatedObjectLookupPopup = showRelatedObjectLookupPopup;
    window.dismissRelatedLookupPopup = dismissRelatedLookupPopup;
    window.showRelatedObjectPopup = showRelatedObjectPopup;
    window.updateRelatedObjectLinks = updateRelatedObjectLinks;
    window.dismissAddRelatedObjectPopup = dismissAddRelatedObjectPopup;
    window.dismissChangeRelatedObjectPopup = dismissChangeRelatedObjectPopup;
    window.dismissDeleteRelatedObjectPopup = dismissDeleteRelatedObjectPopup;

    // Kept for backward compatibility
    window.showAddAnotherPopup = showRelatedObjectPopup;
    window.dismissAddAnotherPopup = dismissAddRelatedObjectPopup;

    $(document).ready(function() {
        $("a[data-popup-opener]").click(function(event) {
            event.preventDefault();
            opener.dismissRelatedLookupPopup(window, $(this).data("popup-opener"));
        });
        $('body').on('click', '.related-widget-wrapper-link', function(e) {
            e.preventDefault();
            if (this.href) {
                var event = $.Event('django:show-related', {href: this.href});
                $(this).trigger(event);
                if (!event.isDefaultPrevented()) {
                    showRelatedObjectPopup(this);
                }
            }
        });
        $('body').on('change', '.related-widget-wrapper select', function(e) {
            var event = $.Event('django:update-related');
            $(this).trigger(event);
            if (!event.isDefaultPrevented()) {
                updateRelatedObjectLinks(this);
            }
        });
        $('.related-widget-wrapper select').trigger('change');
        $('body').on('click', '.related-lookup', function(e) {
            e.preventDefault();
            var event = $.Event('django:lookup-related');
            $(this).trigger(event);
            if (!event.isDefaultPrevented()) {
                showRelatedObjectLookupPopup(this);
            }
        });
    });

})(django.jQuery);

Я не вижу JQuery в вашем текущем HTML, вам нужно импортировать его для каждой HTML-страницы, на которой вы хотите его использовать.

Nicolas 25.10.2018 04:50

Браузер выполняет выборку ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.jsдо для любых других загрузок / выполнения .js на текущей странице? 200, предупреждений нет?

user2864740 25.10.2018 04:50

@ user2864740 вообще никаких предупреждений.

Avinash Raj 25.10.2018 04:51

..и на вкладке «Сеть» отображается 200-OK для ресурса jquery до, какие-либо другие сценарии? (например, браузер не кэширует устаревшую HTML-страницу, включить ее на HTML-страницу, как ожидалось?)

user2864740 25.10.2018 04:52

Почему у вас есть сценарий, src которого указывает на папку, а не на файл .js?

Barmar 25.10.2018 04:54

Вы не получаете ошибку от начальной загрузки, но получаете ее от RelatedObjectLookups.js? Это говорит о том, что что-то среднее между ними - неопределенные jQuery и $.

Barmar 25.10.2018 04:55

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

Barmar 25.10.2018 04:56

@Barmar скопировал отсюда stackoverflow.com/a/12916263/3297613

Avinash Raj 25.10.2018 04:56

в конце сценария RelatedObjectLookups.js они включили )(django.jQuery);

Avinash Raj 25.10.2018 05:01

вероятно, верхняя часть RelatedObjectLookups.js будет выглядеть как (function($) { и ожидает передачи объекта jquery. Если вы не создаете объект django и не прикрепляете к нему jQuery где-либо, это может быть вашей проблемой. Я недостаточно знаю о dgango, чтобы понять, что это вообще значит, но, вероятно, версия jquery из CDN Google этого не делает. - Вы можете изменить этот файл? В таком случае я бы попробовал window.jQuery.

lemieuxster 25.10.2018 05:16

замена $(document.ready строки № 177 на django.jQuery( document ).ready(function($) работает

Avinash Raj 25.10.2018 05:17
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
1
11
890
1

Ответы 1

Я почти уверен, что вся ваша проблема в том, что в самом конце вашего JS файла RelatedObjectsLookups.js написано django.jQuery, которого не существует (или, по крайней мере, файл googleapis jQuery, который вы загружаете, не будет определять это). Измените его на window.jQuery, и все должно работать для вас.

ИЗМЕНИТЬ на основе вашего ответа

Поскольку вы не можете изменить строку с надписью django.jQuery, давайте определимся с этим.

Сразу после включения файла jQuery добавьте следующий тег.

<script>
  django = django || {};
  django.jQuery = django.jQuery || jQuery;
</script>

Это установит для django.jQuery значение jQuery (который включен в ваш файл googleapis), если он еще не установлен. Теперь он будет существовать для использования вашими более поздними скриптами.

Я не могу изменить файл библиотеки

Avinash Raj 25.10.2018 05:55

Другие вопросы по теме