2012-05-18 9 views
6

Ich verwende jQuery in einer Webseite. Bei Verwendung von $ im Internet Explorer funktioniert es gut. Wenn $ in Chrome oder Firefox Referenzierung nicht mit Fehlern:

Uncaught ReferenceError: $ is not defined. 

Screenshot:

enter image description here

Mit meinem Quellcode:

<!DOCTYPE html> 
<html> 
<head> 
    <script type="text/javascript" src="jquery-1.7.2.min.js"></script> 
    <script type="text/javascript"> 
     function divClick(sender, event) 
     { 
//  var chk = $(sender).find("input").first()[0]; 
     var chk = jQuery(sender).find("input").first()[0]; 
     alert("Works in ie"); 
     } 
    </script> 
</head> 
<body> 

<div onclick="divClick(this, event)"> 
    <input type="checkbox"> 
</div> 

</body> 
</html> 

Hinweis: Der Browser sein wird auf eine Datei im lokalen Dateisystem gerichtet:

enter image description here

aktualisieren: Versucht es zu jQuery ändern.

aktualisieren: Chrome findet die Jquery-Datei (das heißt kein 404):

enter image description here

+0

Überprüfen Sie, ob 'jquery-1.7.2.min.js' im selben Ordner wie der HTML-Ordner ist. '$ ist nicht definiert' ist ein Fehler, den Sie erhalten, wenn jQuery lib nicht enthalten ist. –

+0

Können Sie ein Beispiel dafür geben, wie Sie meine Funktion in einem dom-fähigen Format bereitstellen können? Und wie bewegt man den Klick-Listener zur js? Schau dir mein Beispiel unten an. – Patriotec

Antwort

7

Und diese Frage ist hier nur den Fehler in Chrome und Firefox zu dokumentieren:

Html File encoding   IE9  Chrome 
========================= ======= ====== 
Windows-1252     Works Works 
UTF-8 (without BOM)   Works Works 
UTF-8 (with BOM EFBB)  Works Works 
UTF-16 (with LE BOM FFFE) Works Fails 
UTF-16 (with BE BOM FEFF) Works Fails 

Vermutlich Chrome (und Firefox) gehen davon aus, dass eine separate script Datei die gleiche Codierung wie die html Datei hat.

Chrome versucht dann, jquery-1.7.2.js als UTF-16 zu lesen, und ist schockiert, um festzustellen, dass die Datei pure (Windows-1252) Müll ist.

5

Überprüfen Sie, ob der Weg der jquery-1.7.2.min.js korrekt ist. Sie können Firebug einchecken, wenn Sie das Firefox- oder Chrome-Entwicklertool verwenden, um zu sehen, ob die Datei heruntergeladen wird. Sie erhalten wahrscheinlich 404 für die jQuery-Datei, da $ auf der Seite, die ein Alias ​​für das jQuery-Objekt ist, nicht definiert ist.

0

Versuchen:

var chk = jQuery(sender).find("input").first()[0]; 
+0

Aktualisierte die Frage, um das zu enthalten. –

0

Ihre Funktion muss bereit, in einem dom gewickelt werden:

$(function(){ 

    function divClick(sender, event) 
    { 
    var chk = $(sender).find("input").first()[0]; 
    alert("Works in ie"); 
    } 

}); 

, dass die Funktion nur feuern können, nachdem die Seite geladen wird. sollten auch Ihre Skripte kurz vor dem schließenden HTML-Tag geladen werden. nicht die ganze Spitze. Dadurch kann die Seite HTML und CSS schneller laden, da sie nicht auf das Laden von JS warten muss.

Stellen Sie außerdem sicher, dass Sie den richtigen Pfad zu jQuery von Ihrem HTML haben.

Letzte Sache,

Stattdessen wenn Sie hier klicken, Zuhörer in Inline-HTML mit versuchen, es auf die JS zu bewegen. Es ist nur eine sauberere, organisierte Art, damit umzugehen.

$('.clickMe').click(function(){ 
    //do stuff here 
}) 
+0

Könnten Sie ein Beispiel dafür geben, wie ich meine Funktion in einem Dom Ready * verpacken kann? Und wie bewegt man den Klick-Listener zum 'js'? –

+0

Sie sind dort die Dom-Ready ist die $ (function() {}) Es ist die jQuery Kurzhand-Version. für die Click-Ereignisreferenz diese jsfiddle. http://jsfiddle.net/QgeD9/ – laymanje

0

Statt des onclick im HTML, habe ich alles über ID im Jquery-Code zugewiesen.

Ich bin mir nicht sicher, ob Sie wissen möchten, ob das div aktiviert ist oder ob das Kontrollkästchen aktiviert ist. Ich habe die Eingabe in den Code eingegeben und Code auskommentiert, wenn das div angeklickt wird.

<!DOCTYPE html> 
<html> 
<head> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script> 

<script type="text/javascript"> 
$(function(){ 
// $('#divid').unbind("click").click(function(){ 
$('#someid').unbind("click").click(function(){ 
if($(this).is(':checked')){ 
alert("checked"); 
}else{ 
alert("not checked"); 
} 
}); 
}); 
</script> 

</head> 
<body> 

<div id="divid"><input type="checkbox" id="someid"></div> 

</body> 
</html> 
2

Sie können diesen Fehler mit Javascript in Firefox und Chrome erhalten:

Uncaught ReferenceError: $ is not defined. 

Wenn Sie jquery wie folgt enthalten:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js"> 
</script> 

Und der Server so konfiguriert ist, nicht JavaScript-Inhalte erlauben heruntergeladen werden und zur Laufzeit ausgeführt werden, dann erhalten Sie den obigen Fehler. Werfen Sie einen Blick auf dem ganzen Fehler:

[blocked] The page at https://yoursite.com/blah# ran insecure content 
from http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js. 
/blah#:1 
Uncaught ReferenceError: $ is not defined 

Was es bedeutet, ist Ihr Webserver nicht Javascript Inhalt on the fly geladen werden läßt. Es ist ein Sicherheitsrisiko, weil jemand böses Zeug hineinschleusen kann, damit du es herunterladen und deine Server besitzen kannst.

1

Keines der oben genannten anwendbar war für mich auf Chrome 49. ich den Typen als "application/javascript" wie so angeben hatte:

<script src="lib/jquery-1.11.3.min.js" type="application/javascript"></script> 

Mit "text/javascript" funktioniert nicht.

+0

es funktionierte wirklich wie ein Charme :) versuchte viele Lösungen, aber konnte keine Lösung wie folgt finden –

Verwandte Themen