Как исправить ошибку «Uncaught TypeError: $ Is Not a Function» в WordPress

Опубликовано: 2024-03-20

Ах, классическая ошибка «Uncaught TypeError: $ is not a function» в WordPress. Если вы окунулись в разработку сайтов WordPress, возможно, вы наткнулись на эту ошибку. Это все равно, что пытаться утром завести машину и понять, что она не заводится, потому что вы используете неправильный ключ. В WordPress такой машиной является jQuery, а символ «$» — это ключ, который иногда не подходит.

Что такое ошибка «Uncaught TypeError: $ is not a function»?

Давайте разберемся. jQuery, всеми любимая библиотека JavaScript, упрощает перемещение HTML-документов, обработку событий, анимацию и взаимодействие Ajax для быстрой веб-разработки. Это набор инструментов, на который опираются многие темы и плагины WordPress для реализации своих необычных функций.

сайт jQuery. Использование символа доллара в этой библиотеке javascript приводит к ошибке «Uncaught TypeError: $ is not a function» в WordPress.

В jQuery символ «$» является сокращением от «jQuery», что делает код более понятным и простым в написании. Однако, когда WordPress выдает ошибку «Uncaught TypeError: $ is not a function», это, по сути, говорит: «Эй, я не распознаю этот символ «$» как часть jQuery».

Это может произойти по нескольким причинам, но все сводится к WordPress и его уникальному способу работы с jQuery, который часто приводит к путанице и этой ошибке.

Одна из самых сложных частей ошибки «Uncaught TypeError: $ is not a function» — это ее расплывчатый характер. Он не содержит подробных объяснений и не указывает непосредственно на проблемный фрагмент кода. Это похоже на лампочку проверки двигателя вашего автомобиля; вы знаете, что что-то не так, но не можете точно определить проблему без дальнейшего расследования. Эта неопределенность может расстраивать, особенно если вы новичок в отладке WordPress.

Почему появляется ошибка «Uncaught TypeError: $ is not a function»?

За этой ошибкой стоит несколько обычных подозреваемых:

  1. Библиотека jQuery загружена неправильно . Если WordPress не может найти jQuery, то символ «$» для него ничего не значит. Это все равно, что пытаться читать книгу в темноте. Вы знаете, что слова есть, но вы их не видите.
  2. WordPress находится в режиме noConflict : по умолчанию WordPress загружает jQuery таким образом, чтобы предотвратить его конфликты с другими библиотеками, которые также могут использовать символ «$». Это немного похоже на то, как если бы на кухне два повара настаивали на использовании одного и того же ножа. Чтобы избежать кулинарной катастрофы, WordPress делает шаг назад и говорит: «Хорошо, я не буду использовать символ «$».
  3. Конфликты плагинов или тем. Иногда ошибка возникает из-за того, что плагин или тема некорректно взаимодействуют с другими, поскольку использование символа «$» противоречит настройкам WordPress по умолчанию.

Находим источник ошибки

Хотя знание конкретной причины ошибки не обязательно для ее устранения, если вам все же нужно знать, что происходит, у вас есть несколько вариантов, которые помогут вам отследить источник этой неуловимой ошибки.

Ваши детективные навыки вступят в игру благодаря двум мощным инструментам: консоли разработчика и журналам отладки WordPress.

Консоль разработчика : доступ к этому бесценному инструменту можно получить из браузера.Щелкните правой кнопкой мыши на своей веб-странице, выберите «Проверить» или «Проверить элемент», а затем перейдите на вкладку «Консоль».

Вкладка консоли выделена в инструментах разработчика Chrome. Это полезно для отслеживания источника ошибки «Uncaught TypeError: $ is not a function» в WordPress.

Эта консоль отображает сокровищницу информации о том, что происходит за кулисами вашего веб-сайта, включая нашу неуловимую ошибку. Это похоже на карту, которая указывает вам, где находится сокровище (или, в данном случае, проблема).

Журналы отладки WordPress . При проблемах, которые затрагивают более глубокие слои вашего сайта WordPress, включение WP_DEBUG может спасти жизнь.Эта функция, если она включена, записывает все ошибки, предупреждения и уведомления в файл debug.log в каталоге wp-content. Чтобы активировать его, вам нужно отредактировать файл wp-config.php и установить для WP_DEBUG значение true.

Файл wp-config.php отображается в текстовом редакторе с режимом wp_debug, установленным в значение true. Это может помочь найти источник неперехваченной ошибки типа, которая не является ошибкой функции в WordPress.

Думайте об этом как об установке камер наблюдения по всему вашему сайту; ничто не ускользает незамеченным.

Как исправить ошибку «Uncaught TypeError: $ is not a function» в WordPress

Независимо от конкретной причины ошибки, именно здесь резина встречается с дорогой. Исправление ошибки «Uncaught TypeError: $ is not a function» заключается в поиске правильного ключа для запуска автомобиля, и есть две простые стратегии, позволяющие обойти это препятствие без настройки режима «noConflict».

1. Выберите «jQuery» вместо «$».

Когда ваши сценарии натыкаются на символ «$» и выдают ошибку, одно простое решение — заменить каждый экземпляр «$» на «jQuery» в вашем коде. Для справки, вот как выглядит стандартный фрагмент jQuery с использованием символа $:

 $(функция() {
  // Ваш код с нетерпением ждет здесь запуска после полной загрузки DOM
});

Столкнувшись с ошибкой, простым, но эффективным решением является замена «$» на «jQuery». Следовательно, исправленный фрагмент будет таким:

 jQuery(функция() {
  // Эврика! Код работает плавно, не вызывая никаких ошибок.
});

Для тех, кто предпочитает более тонкий подход, заключение вашего кода в немедленно вызываемое функциональное выражение (IIFE), которое передает символ «$», может изменить правила игры. Этот метод позволяет безопасно использовать '$' внутри функции, не вызывая ужасную ошибку:

 jQuery(функция($) {
    // Внутри этой волшебной оболочки вы можете управлять только «$».
    console.log($('.primary-menu'));
});

После реализации этих настроек воспользуйтесь инструментами разработчика вашего браузера или загляните в журнал отладки WordPress, чтобы убедиться в исчезновении ошибки «Uncaught TypeError: $ is not a function». Если ошибка не исчезнет, ​​рассмотрите возможность переназначения «jQuery» на другой псевдоним, чтобы избежать дальнейших осложнений.

2. Создайте собственный псевдоним для jQuery.

Поскольку «$» служит сокращением по умолчанию в jQuery, режим WordPress «noConflict» может потребовать альтернативного псевдонима, чтобы избежать конфликтов библиотек. Этот подход на удивление прост и позволяет назначить новый символ с помощью всего лишь одной строки кода:

 вар $j = jQuery;

Этот фрагмент фактически назначает «$j» в качестве нового псевдонима для jQuery, хотя вы можете выбрать любой символ, который вам подходит. Этот метод особенно привлекателен для разработчиков, которым несколько утомительно несколько раз набирать «jQuery».

Стоит отметить, что даже после настройки нового псевдонима возможность использования «jQuery» остается.

Подводя итоги

Используя любой из этих двух методов, вы можете изящно обойти ошибку «Uncaught TypeError: $ is not a function» и обеспечить бесперебойную работу ваших сценариев jQuery в WordPress.

Независимо от того, решите ли вы заменить «$» на «jQuery» напрямую или создать собственный псевдоним, оба пути ведут к гармоничному сосуществованию jQuery с другими скриптами в режиме WordPress «noConflict». Помните, что ключ к бесперебойной работе веб-сайта заключается в понимании и адаптации к его базовым структурам.