Подтвердить что ты не робот

JQuery Uncaught TypeError: Не удается прочитать свойство 'fn' из undefined (анонимная функция)

Все, Я получаю сообщение об ошибке из моего кода, который я загрузил. Вот код:

/*----------------------------------------------------------------------*/
/* wl_Alert v 1.1 
/* description: Handles alert boxes
/* dependency: jquery UI Slider, fadeOutSlide plugin
/*----------------------------------------------------------------------*/


$.fn.wl_Alert = function (method) {
var args = arguments;
return this.each(function () {

    var $this = $(this);


    if ($.fn.wl_Alert.methods[method]) {
        return $.fn.wl_Alert.methods[method].apply(this, Array.prototype.slice.call(args, 1));
    } else if (typeof method === 'object' || !method) {
        if ($this.data('wl_Alert')) {
            var opts = $.extend({}, $this.data('wl_Alert'), method);
        } else {

            var opts = $.extend({}, $.fn.wl_Alert.defaults, method, $this.data());
        }
    } else {
        $.error('Method "' + method + '" does not exist');
    }


    if (!$this.data('wl_Alert')) {

        $this.data('wl_Alert', {});

        //bind click events to hide alert box
        $this.bind('click.wl_Alert', function (event) {
            event.preventDefault();

            //Don't hide if it is sticky
            if (!$this.data('wl_Alert').sticky) {
                $.fn.wl_Alert.methods.close.call($this[0]);
            }

            //prevent hiding the box if an inline link is clicked
        }).find('a').bind('click.wl_Alert', function (event) {
            event.stopPropagation();
        });
    } else {

    }
    //show it if it is hidden
    if ($this.is(':hidden')) {
        $this.slideDown(opts.speed / 2);
    }

    if (opts) $.extend($this.data('wl_Alert'), opts);
});

};

$.fn.wl_Alert.defaults = {
speed: 500,
sticky: false,
onBeforeClose: function (element) {},
onClose: function (element) {}
};
$.fn.wl_Alert.version = '1.1';


$.fn.wl_Alert.methods = {
close: function () {
    var $this = $(this),
        opts = $this.data('wl_Alert');
    //call callback and stop if it returns false
    if (opts.onBeforeClose.call(this, $this) === false) {
        return false;
    };
    //fadeout and call an callback
    $this.fadeOutSlide(opts.speed, function () {
        opts.onClose.call($this[0], $this);
    });
},
set: function () {
    var $this = $(this),
        options = {};
    if (typeof arguments[0] === 'object') {
        options = arguments[0];
    } else if (arguments[0] && arguments[1] !== undefined) {
        options[arguments[0]] = arguments[1];
    }
    $.each(options, function (key, value) {
        if ($.fn.wl_Alert.defaults[key] !== undefined || $.fn.wl_Alert.defaults[key] == null) {
            $this.data('wl_Alert')[key] = value;
        } else {
            $.error('Key "' + key + '" is not defined');
        }
    });

}
};

//to create an alert box on the fly
$.wl_Alert = function (text, cssclass, insert, after, options) {
//go thru all
$('div.alert').each(function () {
    var _this = $(this);
    //...and hide if one with the same text is allready set
    if (_this.text() == text) {
        _this.slideUp($.fn.wl_Alert.defaults.speed);
    }
});

//create a new DOM element and inject it
var al = $('<div class="alert ' + cssclass + '">' + text + '</div>').hide();
(after) ? al.appendTo(insert).wl_Alert(options) : al.prependTo(insert).wl_Alert(options);

//return the element
return al;
};

Кто-нибудь видел этот тип ошибок раньше? Как мне разрешить что-то подобное? Спасибо за любой совет, который у вас есть!

4b9b3361

Ответ 1

Попробуйте следующее:

(function ( $ ) { 

    // put all that "wl_alert" code here   

}( jQuery ));

Итак, переменная $, по-видимому, повреждена, но переменная jQuery все равно должна ссылаться на объект jQuery. (В обычных условиях переменные $ и jQuery относятся к одному и тому же объекту jQuery.)

Вместо того, чтобы заменить имя $ на имя jQuery во всем коде, вы можете просто использовать IIFE для псевдоним имя вручную. Таким образом, внешняя переменная jQuery имеет псевдоним с переменной $ внутри функции.

Вот простой пример, который поможет вам понять эту концепцию:

var foo = 'Peter';

(function ( bar ) {

    bar // evaluates to 'Peter'

}( foo ));

Ответ 2

попробуйте вызвать библиотеку jQuery до загрузки bootstrap.js

<script src="js/jquery-3.3.1.min.js"></script>
<script src="js/bootstrap.min.js"></script>

Ответ 3

Если вы не можете прочитать свойство "fn" undefined, проблема может заключаться в том, что вы загружаете библиотеки в неправильный порядок.

Например:

Сначала загрузите bootstrap.js, а затем загрузите библиотеки bootstrap.js.

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap3-dialog/1.34.7/js/bootstrap-dialog.min.js"></script>

Ответ 4

Импортируйте jquery CDN как первый

(например)

<script
  src="https://code.jquery.com/jquery-3.3.1.min.js"
  integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
  crossorigin="anonymous"></script>

Ответ 5

Вы можете использовать функцию noConflict:

var JJ= jQuery.noConflict(); 
JJ('.back').click(function (){
    window.history.back();
}); 

Измените все $на JJ.

Ответ 6

Я исправил это, добавив jquery.slim.min.js после jquery.min.js, как последовательность решений.

Последовательность проблем

<script src="./vendor/jquery/jquery.min.js"></script>
<script src="./vendor/bootstrap/js/bootstrap.bundle.min.js"></script>

Последовательность решения

<script src="./vendor/jquery/jquery.min.js"></script>
<script src="./vendor/jquery/jquery.slim.min.js"></script>
<script src="./vendor/jquery-easing/jquery.easing.min.js"></script>

Ответ 7

Эта ошибка также может возникнуть, если у вас есть require.js(requirejs), и вы не обернули какую-нибудь библиотеку, которую используете внутри

define(['jquery'], function( jQuery ) { ... lib function ... });

ПРИМЕЧАНИЕ: вам не нужно это делать, если эта библиотека поддерживает AMD. Вы можете быстро проверить это, открыв эту библиотеку и просто ctrl + f "amd":)

Ответ 8

У меня тоже был "Uncaught TypeError: невозможно прочитать свойство" fn "из undefined" с помощью:

$.fn.circleType = function(options) {

CODE...

};

Но исправил его, обернув его в функцию готовности документа:

jQuery(document).ready.circleType = function(options) {

CODE...

};

Ответ 9

У меня была такая же проблема при использовании bootstrap-datewidget и загруженного jquery в заголовке вместо того, чтобы загружать его в конец тела, и он работал.

Ответ 10

Я согласен с MarsPeople относительно загрузки библиотек в неправильном порядке. Мой пример - работать с owl.carousel.

Я получил ту же ошибку при импорте jquery после owl.carousel:

<script src="owl.carousel.js"></script>
<script src="jquery-3.1.1.min.js"></script>

и зафиксировал его, импортировав jquery перед owl.carousel:

<script src="jquery-3.1.1.min.js"></script>
<script src="owl.carousel.js"></script>

Ответ 11

Надеюсь, это поможет кому-то на земле. В моем случае jQuery и $ были доступны, но не тогда, когда плагин загружался, поэтому я все обернул в setTimeout. Обертывание внутри setTimeout помогло мне исправить ошибку:

setTimeout(() => {
    /** Your code goes here */

    !function(t, e) {

    }(window);

})

Ответ 12

Ха-ха-ха Забавно, это простая ошибка для меня

Я получил async вызов в библиотеке JQuery. Просто удалите это, и я получил решение.

<script async src="https://code.jquery.com/jquery-3.3.1.min.js"></script>

К

<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>

Почему он так себя вел: я получил документацию по W3schools LINK

Определение и использование асинхронно

Атрибут async является логическим атрибутом.

Когда он присутствует, он указывает, что скрипт будет выполняться асинхронно, как только он станет доступен.

Примечание. Атрибут async предназначен только для внешних скриптов (и должен использоваться только при наличии атрибута src).

Примечание. Существует несколько способов выполнения внешнего скрипта:

1. Если присутствует асинхронный: сценарий выполняется асинхронно с остальной частью страницы (сценарий будет выполняться, пока страница продолжает анализ)

2. Если асинхронный режим отсутствует, а отсрочка присутствует: скрипт выполняется после завершения анализа страницы.

3. Если нет ни асинхронного, ни отсроченного: скрипт выбирается и выполняется немедленно, прежде чем браузер продолжит синтаксический анализ страницы.