Ошибка при вызове функций из $(document).ready

220
05 ноября 2018, 01:10

На сайте используются плагины Magnific Popup и slick. При вызове функций с их использованием следующим образом:

$(document).ready(function() {
    initPopupsFromComBlock();
    runBrandsSlick();
    //some other code.....
});

Получаю в консоле ошибку - TypeError: $(...).magnificPopup is not a function. Однако, если вынести вызов этих функций за пределы $(document).ready,

initPopupsFromComBlock();
runBrandsSlick();

то все работает нормально. initPopupsFromComBlock() находится за пределами $(document).ready.

function initPopupsFromComBlock() {
    $('.fast-order').magnificPopup({
        .......
    });
}

Последовательность подключения скриптов:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<script src="{{ asset('js/magnific-popup/jquery.magnific-popup.js') }}"></script>
<script type="text/javascript" src="{{ asset('slick/slick.min.js') }}"></script>
<script type="text/javascript" src="/js/myscript.js" ></script>

П.С.: Такую же ошибку выдает и в случае, если код из вызываемой функции полностью поместь во внутрь $(document).ready. В чем прикол?

П.П.С: Далее подобная проблема возникает при вызове функции, в которой используется Magnific Popup, из другой функции.

function getCurrency() {
$.ajax({
    url: "/modules/content/ajax/get_currency.php",
    type: 'GET',
    dataType: 'HTML'})
        .done(function (data) {
            if (data) {
                $('.top-popups .currency-wrap .d-table a').remove();
                $('.top-popups .currency-wrap .d-table').append(data);
            } else {
                magnificPopupOpenError('Во время загрузки валюты произошла ошибка!');
            }
        }).fail(function () {
    magnificPopupOpenError('Сервер не отвечает!');
});

}

Функция magnificPopupOpenError:

function magnificPopupOpenError(text) {
$.magnificPopup.open({
    items: {
        src: '<div id="white-popup"><div class="custom-border-tooltip">' + text + '</div></div>',
        type: 'inline'
    }
});

}

Ошибка: TypeError: $.magnificPopup is undefined

READ ALSO
CyD Network Utilites не показывает всю ссылку целиком

CyD Network Utilites не показывает всю ссылку целиком

Внизу где ссылка не полностью отображена, как скопировать её полностью?

186
CSS Как добавить икнонку

CSS Как добавить икнонку

Как добавить иконки в блок, сделать чтобы все 4 блока были одинаковыми и не разъезжались, когда в них добавляется текст? Желательно с объяснением,...

409
Невидимые символы в textarea

Невидимые символы в textarea

Есть необходимость добавлять в текст, который отображается в textarea, служебные символыЭти символы не должны быть видны пользователю

159