Błąd „jQuery nie jest zdefiniowany” jest częstą przeszkodą napotykaną podczas tworzenia stron internetowych, szczególnie w przypadku osób, które dopiero zaczynają integrować jQuery, powszechnie używaną bibliotekę JavaScript, ze stronami internetowymi.
Ten komunikat o błędzie pojawia się w konsoli przeglądarki, gdy kod JavaScript próbuje wykorzystać składnię lub funkcje jQuery przed załadowaniem biblioteki lub jeśli w ogóle nie został załadowany.
Zasadniczo jest to sposób, w jaki przeglądarka mówi: „Nie wiem, czym jest jQuery”, co prowadzi do natychmiastowego zatrzymania wykonywania wszelkich skryptów związanych z jQuery.
Pożegnaj błędy na stronie
Osiągnij spokój ducha dzięki 99,99% czasu sprawności w 10Web Managed
Hosting WordPress, obsługiwany przez Google Cloud.
Odmiany błędu
Błąd „jQuery nie jest zdefiniowany” może objawiać się na różne sposoby, w zależności od przeglądarki, środowiska (np. środowiska programistycznego lub serwera produkcyjnego) lub sposobu umieszczenia skryptu na stronie internetowej. Niektóre typowe odmiany tego komunikatu o błędzie obejmują:
- jQuery nie jest zdefiniowane
- $ nie jest zdefiniowane
- Nieprzechwycony błąd odniesienia: $ nie jest zdefiniowany
- Nieprzechwycony błąd odniesienia: jQuery nie jest zdefiniowane
- ReferenceError: jQuery nie jest zdefiniowane
- ReferenceError: $ nie jest zdefiniowane
- TypBłąd: $(…). nie jest funkcją
- TypBłąd: jQuery(…). nie jest funkcją
Zrozumienie „jQuery nie jest zdefiniowane” w WordPress
W ekosystemie WordPress jQuery jest szeroko wykorzystywane przez motywy i wtyczki w celu zwiększenia interaktywności i poprawy komfortu użytkownika. Być może wtyczka, której używasz, została zaprojektowana tak, aby wykorzystywać funkcjonalność jQuery — suwaki, wyskakujące okienka, sprawdzanie poprawności formularzy i nie tylko. Kiedy przeglądarka zgłasza, że „jQuery nie jest zdefiniowane”, oznacza to zasadniczo, że JavaScript Twojej witryny próbuje wywołać funkcje jQuery przed załadowaniem samego jQuery lub w ogóle nie został załadowany.
Typowe przyczyny tego błędu w WordPress
Do tego błędu może prowadzić kilka scenariuszy specyficznych dla WordPressa, w tym:
Motywy i wtyczki: Motyw lub wtyczka, która nieprawidłowo kolejkuje jQuery lub opiera się na nieaktualnej wersji, może powodować ten problem.
Ręczne zmiany: Niestandardowe zmiany w plikach motywów, zwłaszcza jeśli jQuery zostało ręcznie wyrejestrowane lub nieprawidłowo umieszczone w kolejce, mogą spowodować ten błąd.
Konflikty: Czasami zainstalowanie wielu wtyczek, z których każda próbuje załadować własne wersje jQuery, może prowadzić do konfliktów, a w konsekwencji do błędu.
Ogólne przyczyny tego błędu
Nieprawidłowa kolejność skryptów: najczęstszą przyczyną jest to, że Twoja strona HTML próbuje użyć jQuery przed jej załadowaniem. Skrypty bazujące na jQuery muszą być umieszczone po bibliotekach jQuery etykietka.
Brak uwzględnienia jQuery: Po prostu zapomnienie o umieszczeniu jQuery na swojej stronie internetowej może spowodować ten błąd. Upewnij się, że masz tag, który poprawnie pozyskuje bibliotekę jQuery.
Konfliktowe biblioteki: Czasami inne biblioteki lub skrypty JavaScript mogą powodować konflikt z jQuery, zwłaszcza jeśli również używają $ symbol. Może to nieumyślnie spowodować nadpisanie lub niepoprawną inicjalizację jQuery.
Problemy z buforowaniem: W niektórych przypadkach Twoja przeglądarka może buforować starą wersję Twojej strony internetowej, która nie zawierała jQuery, lub ścieżka do jQuery może być niepoprawna, co prowadzi do niepowodzenia w ładowaniu biblioteki.
Problemy z siecią dostarczania treści (CDN).: Jeśli ładujesz jQuery z CDN, a CDN nie działa lub jest nieosiągalny, Twoja witryna nie będzie mogła załadować biblioteki, co powoduje ten błąd.
Pożegnaj błędy na stronie
Osiągnij spokój ducha dzięki 99,99% czasu sprawności w 10Web Managed
Hosting WordPress, obsługiwany przez Google Cloud.
Jak naprawić błąd niezdefiniowany jQuery
Przed wprowadzeniem jakichkolwiek zmian niezbędne jest wykonanie pełnej kopii zapasowej witryny. Jeśli masz dostęp do środowiska testowego lub programistycznego, możesz użyć tego środowiska, aby naprawić błąd i ominąć wszelkie potencjalne zakłócenia wynikające z bezpośrednich edycji w działającej witrynie.
Dzięki tym zabezpieczeniom możesz uporać się z błędem „jQuery nie jest zdefiniowany”.
Sprawdź, czy jQuery jest załadowane, testując źródło skryptu
Jedną z częstych przyczyn tego problemu jest to, że chociaż jQuery może być uwzględnione, nie jest ono poprawnie ładowane z różnych powodów, takich jak nieprawidłowe adresy URL, problemy z siecią lub uprawnienia dostępu do plików. Aby sprawdzić, czy jQuery jest poprawnie załadowany, prosty, ale skuteczny sposób polega na przetestowaniu źródła skryptu bezpośrednio w przeglądarce.
Kroki testowania źródła skryptu jQuery
-
- Po pierwsze, musisz zlokalizować tag skryptu, który zawiera jQuery w kodzie HTML. Znacznik ten jest kluczowy, gdyż określa źródło, z którego ma zostać załadowane jQuery. Poszukaj w swoim kodzie linii wyglądającej tak:
- Ten źródło atrybut zawiera adres URL biblioteki jQuery, którą próbujesz załadować.
- Wyodrębnij adres URL z pliku źródło atrybut znacznika skryptu. To jest bezpośredni link do pliku jQuery, który umieszczasz w swojej witrynie. Upewnij się, że dokładnie kopiujesz cały adres URL, łącznie z http:// Lub https:// część na początku.
- Otwórz nową kartę lub okno w przeglądarce internetowej i wklej skopiowany adres URL w pasku adresu. Naciśnij Enter, aby przejść do tego adresu URL.
Jeśli plik jQuery zostanie poprawnie załadowany, cała zawartość biblioteki jQuery zostanie wyświetlona w przeglądarce jako zwykły tekst. Oznacza to, że źródło skryptu jQuery jest dostępne i działa zgodnie z oczekiwaniami.
Alternatywne metody weryfikacji ładowania jQuery
Jak sprawdzić ładowanie jQuery poprzez źródło strony
- Przejdź do strony internetowej, którą chcesz sprawdzić, korzystając z preferowanej przeglądarki internetowej.
- Kliknij prawym przyciskiem myszy w dowolnym miejscu strony internetowej i wybierz Wyświetl źródło strony z menu kontekstowego. Ta opcja może się nieznacznie różnić w zależności od przeglądarki.
- Po otwarciu kodu źródłowego będziesz musiał teraz znaleźć skrypt jQuery. Można to łatwo zrobić, korzystając z funkcji wyszukiwania wbudowanej w przeglądarkę:
- Naciskać Ctrl+F w systemie Windows lub Polecenie+F na komputerze Mac, aby otworzyć pasek wyszukiwania.
- Typ jquery w polu wyszukiwania i naciśnij Enter. Ta akcja podświetli wszystkie wystąpienia jquery w kodzie źródłowym.
- Poszukaj linii w podświetlonych wynikach, która przypomina znacznik skryptu łączący się z biblioteką jQuery.
Może to wyglądać mniej więcej tak:
lub dla lokalnie hostowanego jQuery, coś takiego:
Jeśli znajdziesz taką linię, oznacza to, że na Twojej stronie znajduje się jQuery. Jeśli nie, jQuery może nie zostać załadowane, co może być przyczyną występujących problemów.
Korzystanie z narzędzi programistycznych w celu sprawdzenia ładowania jQuery
- Wejdź na swoją stronę internetową i otwórz narzędzia programistyczne w swojej przeglądarce. Zwykle można to zrobić, klikając stronę prawym przyciskiem myszy i wybierając Sprawdzać lub naciskając F12 Lub Ctrl+Shift+I (Windows) / Cmd+Opcja+I (Prochowiec).
- W narzędziach programistycznych znajdź i kliknij plik Sieć patka. Na tej karcie wyświetlane są wszystkie żądania sieciowe wysyłane przez Twoją witrynę podczas jej ładowania.
- Sprawdź Wyłącz pamięć podręczną opcję i przy otwartej karcie Sieć załaduj ponownie witrynę, aby zarejestrować wszystkie działania związane z ładowaniem.
- Użyj opcji filtrowania, aby zawęzić wyniki do plików JavaScript. Zwykle można to zrobić, wybierając opcję JS filtruj lub wpisz jquery w polu filtra/wyszukiwania.
- Przewiń listę ładowanych skryptów lub skorzystaj z funkcji wyszukiwania w zakładce Sieć, aby znaleźć wpisy związane z jQuery. Szukasz pliku zawierającego jquery w jego nazwie, wskazując, że trwa ładowanie biblioteki jQuery.
Upewnij się, że jQuery jest poprawnie zawarte w WordPress
Jeśli okaże się, że jQuery nie jest ładowany lub pomimo jego obecności napotykasz problemy, być może będziesz musiał upewnić się, że jest on poprawnie dołączony do motywu lub wtyczki WordPress. WordPress oferuje solidny sposób zarządzania skryptami poprzez wp_enqueue_script funkcjonować. Ta metoda jest preferowana, ponieważ skutecznie obsługuje zależności skryptów i pomaga uniknąć konfliktów.
Kolejkuj jQuery w WordPress
- Połącz się ze swoją witryną WordPress za pomocą klienta FTP lub menedżera plików dostarczonego przez usługę hostingową.
- Przejdź do swojego folder motywu i znajdź funkcje.php plik. Zaleca się utworzenie motywu podrzędnego i wprowadzenie w nim zmian, aby uniknąć utraty dostosowań po aktualizacji motywu.
- Jeśli brakuje jQuery, możesz umieścić go w kolejce, dodając następujący fragment kodu do pliku funkcje.php plik:
function my_theme_enqueue_scripts() { wp_enqueue_script('jquery'); } add_action('wp_enqueue_scripts', 'my_theme_enqueue_scripts');
Dzięki temu WordPress będzie zawierał jQuery na wszystkich stronach Twojej witryny.
Jeśli dodajesz niestandardowe skrypty zależne od jQuery, pamiętaj o umieszczeniu jQuery jako zależności, tak jak poniżej:
wp_enqueue_script( 'custom-script', get_template_directory_uri() . '/js/custom-script.js', array('jquery'), '1.0', true );
Zaimplementuj lokalną rezerwę za pomocą jQuery hostowanego przez Google
Umieszczanie w witrynie internetowej wersji jQuery hostowanej przez Google jest powszechną praktyką polegającą na korzystaniu z sieci CDN firmy Google w celu szybkiego i niezawodnego dostarczania tej popularnej biblioteki JavaScript. Aby jednak mieć pewność, że Twoja witryna pozostanie odporna na potencjalne awarie CDN lub problemy z siecią, kluczowe znaczenie ma wdrożenie lokalnego rozwiązania awaryjnego. Ta konfiguracja pozwala Twojej witrynie automatycznie używać lokalnie hostowanej wersji jQuery, jeśli z jakiegoś powodu wersja hostowana przez Google nie zostanie załadowana. Ta metoda jest zgodna z najlepszymi praktykami tworzenia stron internetowych, optymalizując wydajność przy jednoczesnym zapewnieniu redundancji. Poniżej znajduje się przewodnik krok po kroku, jak skutecznie wdrożyć tę strategię.
Dołącz bibliotekę jQuery hostowaną przez Google
Najpierw musisz dodać do swojej witryny tag skryptu jQuery hostowany przez Google. Umieść ten znacznik w sekcji dokumentu HTML lub tuż przed zamknięciem tag, aby mieć pewność, że inne skrypty zależne od jQuery będą mogły z niego korzystać. Na przykład:
Dodaj lokalny skrypt zastępczy
Zaraz po tagu skryptu dla jQuery hostowanego przez Google dodasz mały fragment kodu JavaScript. Ten skrypt sprawdza, czy jQuery zostało pomyślnie załadowane z Google CDN. Jeśli nie, dynamicznie zapisuje nowy znacznik skryptu do dokumentu HTML, aby załadować jQuery z lokalnego źródła.
'); ]]>
Pamiętaj o wymianie „/ścieżka/do/local/jquery-3.5.1.min.js” z poprawną ścieżką do pliku jQuery hostowanego na serwerze.
Zrozumienie kodu
okno.jQuery: Ta część skryptu sprawdza, czy obiekt jQuery jest dostępny globalnie, co oznacza, że jQuery zostało pomyślnie załadowane.
dokument.pisz: Ta metoda służy do wstawiania kodu HTML do dokumentu. Służy tutaj do dodania znacznika skryptu do lokalnego pliku jQuery, jeśli wersja CDN nie jest załadowana. Sekwencja ucieczki <\/skrypt> służy do zapobiegania interpretowaniu ciągu jako końca bloku skryptu.
Zrozumienie mechanizmu awaryjnego
Mechanizm awaryjny działa na zasadzie prostego sprawdzenia: okno.jQuery. Jeśli obiekt jQuery nie jest zdefiniowany, oznacza to, że wersja CDN nie została poprawnie załadowana. The dokument.pisz następnie stosuje się metodę wstrzyknięcia nowego tag ładujący jQuery z pliku lokalnego.
Korzyści
- Zapewnia, że jQuery jest zawsze dostępne, nawet w przypadku awarii CDN.
- Lokalne ładowanie jQuery może w niektórych scenariuszach zmniejszyć opóźnienia, zwłaszcza jeśli wersja CDN wolno reaguje lub jeśli w sieci użytkownika występują problemy z połączeniem się z siecią CDN.
- Posiadanie kopii lokalnej daje kontrolę nad używaną wersją jQuery, umożliwiając spójne testowanie i debugowanie.
Dodaj fragment do pliku wp-config.php
Jeśli bez powodzenia próbowałeś różnych metod rozwiązania błędu „nie zdefiniowano jQuery” lub podobnych problemów z JavaScriptem w WordPressie, wyłączenie łączenia skryptów może być przydatnym krokiem w rozwiązaniu problemu. Łączenie skryptów to funkcja WordPress, która łączy wiele plików JavaScript w jedno żądanie, aby skrócić czas ładowania. Może to jednak czasami powodować błędy lub problemy z ładowaniem skryptu, zwłaszcza jeśli występuje konflikt lub określony skrypt nie ładuje się poprawnie.
Edycja pliku wp-config.php
Użyj klienta FTP lub menedżera plików dostarczonego przez panel sterowania hostingu, aby uzyskać dostęp do plików witryny WordPress.
Otwórz wp-config.php plik w edytorze tekstu. Jeśli korzystasz z klienta FTP, musisz najpierw pobrać plik, otworzyć go w edytorze tekstu na komputerze, a następnie przesłać go ponownie po edycji. Jeśli używasz menedżera plików w panelu sterowania hostingu, zazwyczaj możesz edytować plik bezpośrednio w przeglądarce.
Przewiń na dół pliku, tuż przed linią, która czyta /* To wszystko, przestań edytować! Miłego blogowania. */. Tutaj wklej następujący fragment kodu:
/** Absolute path to the WordPress directory. */ if ( !defined('ABSPATH') ) define('ABSPATH', dirname(__FILE__) . '/'); define('CONCATENATE_SCRIPTS', false);
Po dodaniu fragmentu zapisz zmiany. Jeśli edytujesz plik lokalnie na swoim komputerze, pamiętaj o przesłaniu go z powrotem na serwer, zastępując istniejący wp-config.php.
Zrozumienie fragmentu
Definicja ABSPATH: Ta linia zapewnia prawidłowe zdefiniowanie ścieżki bezwzględnej do katalogu WordPress, co jest podstawowym wymogiem prawidłowego działania WordPressa.
Wyłączanie łączenia: Linia `define(‘CONCATENATE_SCRIPTS’, false);` wyraźnie informuje WordPress, aby nie łączył skryptów. Może to pomóc w debugowaniu problemów ze skryptami poprzez ładowanie każdego skryptu osobno, co ułatwia identyfikację, który skrypt może powodować problemy.
Ręcznie dodaj bibliotekę jQuery
Ręczne dołączenie biblioteki jQuery bezpośrednio do motywu WordPress nagłówek.php file jest prostym podejściem, zwłaszcza gdy inne metody rozwiązywania problemów związanych z jQuery nie okazały się skuteczne. Ta metoda zapewnia załadowanie jQuery na początku procesu renderowania strony, co zmniejsza ryzyko wystąpienia błędów „jQuery nie jest zdefiniowane”.
Jak ręcznie dołączyć bibliotekę jQuery
-
- Idź do Biblioteki hostowane przez Google aby uzyskać dostęp do najnowszej wersji jQuery.
- Znajdź najnowszą wersję jQuery wymienioną na stronie i skopiuj dostarczony tag skryptu. T
- Użyj klienta FTP lub menedżera plików dostarczonego przez usługę hostingową, aby uzyskać dostęp do plików witryny WordPress.
- W katalogu WordPress przejdź do wp-content/themes/folder-twojego-motywu/ i znajdź nagłówek.php plik. Zastępować folder-twój-motyw z rzeczywistą nazwą motywu.
- Otwórz nagłówek.php plik w edytorze tekstu. Jeśli używasz menedżera plików za pośrednictwem panelu sterowania hostingu, możesz edytować plik bezpośrednio w przeglądarce.
-
- Wklej tag skryptu jQuery skopiowany z bibliotek hostowanych przez Google zaraz po otwarciu zaznacz w swoim nagłówek.php plik. Umieszczenie go w pobliżu górnej części sekcji head gwarantuje, że jQuery zostanie załadowane wcześniej i będzie dostępne dla wszystkich zależnych od niego skryptów.
Na przykład,
- Po dodaniu znacznika skryptu zapisz plik nagłówek.php plik. Jeśli edytowałeś plik lokalnie na swoim komputerze, nie zapomnij przesłać go z powrotem na serwer, zastępując starą wersję pliku.
Ważne uwagi
Motyw dziecięcy: Jeśli wprowadzasz zmiany bezpośrednio w motywie, najlepszą praktyką jest użycie motywu podrzędnego. Zapobiega to zastąpieniu zmian podczas aktualizacji motywu nadrzędnego.
Przetestuj swoją witrynę: Po ręcznym dodaniu jQuery dokładnie przetestuj swoją witrynę, aby upewnić się, że skrypty działają zgodnie z oczekiwaniami i że nie ma problemów ze zgodnością.
Zamykanie myśli
Na naszym blogu omawialiśmy różne rozwiązania mające na celu rozwiązanie błędu „jQuery nie jest zdefiniowane”, podkreślając znaczenie prawidłowego załadowania i wdrożenia jQuery na stronie internetowej. Omówiliśmy sprawdzanie obecności jQuery poprzez kontrolę źródła strony i kartę Sieć w przeglądarce, a także omawialiśmy zwiększanie niezawodności witryny za pomocą jQuery hostowanego przez Google uzupełnionego lokalną rezerwą.
Dodatkowo sprawdziliśmy zaawansowane techniki rozwiązywania problemów z WordPressem, takie jak wyłączanie łączenia skryptów w pliku wp-config.php plik i ręcznie dodając jQuery do pliku nagłówek.php plik motywu. Przez cały czas nacisk kładziono na ostrożne praktyki edycyjne, w tym używanie środowisk przejściowych i motywów potomnych do bezpiecznych modyfikacji, aby zachować funkcjonalność witryny i wygodę użytkownika.
Pożegnaj błędy na stronie
Osiągnij spokój ducha dzięki 99,99% czasu sprawności w 10Web Managed
Hosting WordPress, obsługiwany przez Google Cloud.