Uncaught ReferenceError: $ nie jest zdefiniowany, gdy plik jquery.js znajduje się na końcu dokumentu

Mam projekt, do którego w stopce odwołują się wszystkie pliki JS, zgodnie z zaleceniami dotyczącymi szybkości wczytywania strony, w tym link do pliku Jquery . Kod ten tworzy „Uncaught ReferenceError”, zakładam, ponieważ jQuery nie został zdefiniowany wcześniej mój skrypt nazywa się:

<html> 
    <head> 
     <link rel="stylesheet" type="text/css" href="css/bootstrap.css"> 
    </head> 
    <body> 
     <p> 
      <a href="#" data-toggle="popover" title="first popover" id="example">hover over me</a> 
     </p> 
     <script type="text/javascript"> 
      $(function(){ 
       $('#example').popover({ trigger:'hover' }); 
      }) 
     </script> 

     <script type="text/javascript" src="js/jquery.min.js"></script> 
     <script type="text/javascript" src="js/bootstrap.js"></script> 
    </body> 
</html>

Jeśli przenieść link jQuery do nagłówka, a następnie kod działa poprawnie, ale to spowolni czas ładowania strony.

Czy istnieje lepszy sposób deklarowania mojej funkcji, tak aby nie wyświetlał tego błędu UncaughtReference, lub czy utrzymywanie łącza Jquery w głowie jest najlepszym rozwiązaniem?

Źródło

2013-04-17 Ila

Musisz załadować skrypt, zanim zaczniesz pisać kod powołując się na ten skrypt. – tymeJV

Jest tak, ponieważ próbujesz użyć jQuery przed załadowaniem jQuery. Trzeba umieścić libs jak jQuery w nagłówku dokumentu

<head> 
    <link rel="stylesheet" type="text/css" href="css/bootstrap.css" /> 
    <script type="text/javascript" src="js/jquery.min.js"></script> 
    <script type="text/javascript" src="js/bootstrap.js"></script> 
</head>

Ogólnie skrypty iść na końcu dokumentu blisko ścisłej tagu ciała i bibliotek, takich jak te, których używasz iść na <head>

Źródło

2013-04-17 15:22:37 brenjt

Niekoniecznie w wyrazie "head"; tuż przed każdym innym JavaScriptem, który polega na jQuery. – bdesham

Dziękuję, to odpowiada na pytanie, które zadawałem: że w tym przypadku skrypty będą zawarte w treści dokumentu, a ja nie mogę ich przenieść, najlepsze miejsce do połączenia z JQuery jest w głowie. – Ila

Przed odniesieniem do biblioteki jQuery należy dołączyć jQuery.

Zmień to:

<script type="text/javascript" src="js/jquery.min.js"></script> 
<script type="text/javascript" src="js/bootstrap.js"></script> 

<script type="text/javascript"> 
$(function(){ 
    $('#example').popover({ trigger:'hover' }); 
}); 
</script>

Należy również pamiętać, że jest to dobry pomysł, aby to jQuery i inne JavaScript w stopce dokumentu w celu zapewnienia, że strona rendering nie jest opóźniony.

Źródło

2013-04-17 15:22:18

OK. Ze względu na ograniczenia projektu (kod generowany przez aplikację) pozycja DOM treści skryptu jest niezbywalna, więc będę musiał umieścić JQuery w nagłówku, jak sądzę. – Ila

@Ali: Niekoniecznie, sprawdź moją odpowiedź. –

Skrypty są wykonywane od góry do dołu dokumentu w kolejności, więc próbujesz odwołać się do biblioteki jQuery przed jej załadowaniem.

Aby rozwiązać ten problem, możesz umieścić własne skrypty w osobnym pliku i zaimportować je po bibliotece jQuery lub umieścić swój skrypt poniżej importu jQuery.

Źródło

2013-04-17 15:23:43 cfs

Ostatnio na stronie jsTree Widziałem inną techniką

na górze (w znaczniku HEAD) można ustawić tylko w ten sposób:

<script>window.$q=[];window.$=window.jQuery=function(a){window.$q.push(a);};</script>

Teraz można zrobić <script>$(function() { /* your $() calls here */ });</script> kiedykolwiek i gdziekolwiek chcesz ...

na koniec zawierać jquery.js jak USAL a następnie ostatni scenariusz jest:

<script>$.each($q,function(i,f){$(f)});$q=null;</script>

nadzieja ta jest przydatna dla kogoś ...

Źródło

2016-02-11 16:56:59 Badjem79

Lubię utrzymanie jQuery na dole, to po prostu trzeba upewnić się, że cała DOM jest ładowany pierwszy i sprawdzić, że bez jQuery jako że nie jest jeszcze użytkowej . Spróbuj użyć tego zamiast:

document.addEventListener("DOMContentLoaded", function(event) { 
     $(function(){ 
      $('#example').popover({ trigger:'hover' }); 
     }); 
});

Źródło

2016-05-08 18:46:33 cpres

Dzięki, to jest praca, to powinna być odpowiedź. – Conan

Czy chcesz usunąć tego słuchacza po fakcie w dowolnym momencie? – whispers

Uncaught ReferenceError: $ nie jest zdefiniowany, gdy plik jquery.js znajduje się na końcu dokumentu

Odpowiedz

Powiązane problemy