Chrome: Uncaught ReferenceError: $ non definito

Sto utilizzando jQuery in una pagina Web. Quando si utilizza $ in Internet Explorer funziona correttamente. Quando si fa riferimento $ in Chrome o Firefox non riesce con l'errore:

Uncaught ReferenceError: $ is not defined.

Screenshot:

enter image description here

Con il mio codice sorgente:

<!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>

Nota: I browser sono in corso diretto a un file sul filesystem locale:

enter image description here

Aggiornamento: Provato cambiandolo in jQuery.

Aggiornamento: Chrome trova il file jquery (vale a dire senza 404):

enter image description here

fonte

2012-05-18 Ian Boyd

Controllare se 'jquery-1.7.2.min.js' è nella stessa cartella del codice HTML. '$ is not defined' è un errore che si ottiene quando jQuery lib non è incluso. –

Puoi dare un esempio di come avvolgere la mia funzione in una dom ready? E anche come spostare l'ascoltatore dei clic su js? Guarda il mio esempio qui sotto. – Patriotec

E questa domanda è qui solo per documentare il bug in Chrome e Firefox:

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

Presumibilmente Chrome (e Firefox) supporre che un file separato script ha la stessa codifica del file html.

Chrome quindi tenta di leggere jquery-1.7.2.js come UTF-16 e rimane scioccato nello scoprire che il file è puro (Windows-1252) spazzatura.

fonte

2012-05-18 20:08:33

Controllare se il percorso di jquery-1.7.2.min.js è corretto. Puoi controllare firebug se usi firefox o lo strumento di sviluppo di Chrome per vedere se il file viene scaricato. Probabilmente ottieni 404 file jQuery a causa del quale $ non è definito nella pagina che è un alias dell'oggetto jQuery.

fonte

2012-05-18 19:50:25 ShankarSangoli

Prova:

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

fonte

2012-05-18 19:51:32

Aggiornata la domanda per includerla. –

La vostra funzione ha bisogno di essere avvolto in un DOM pronto:

$(function(){ 

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

});

che permetterà la funzione di sparare solo dopo che la pagina è stata caricata. anche i tuoi script dovrebbero essere caricati appena prima del tag HTML di chiusura. non tutto in alto. questo permetterà alla pagina di caricare l'HTML e il css più velocemente perché non deve attendere il caricamento del JS.

Assicurati anche di avere il percorso corretto per jQuery dal tuo HTML.

Ultima cosa,

Invece se avere il tuo click ascoltatore in linea HTML provare a spostare al JS. È solo un modo più pulito e organizzato per gestirlo.

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

fonte

2012-05-18 20:05:59 laymanje

Puoi dare un esempio di come * racchiudere la mia funzione in dom *? E anche come spostare il listener dei clic su 'js'? –

Ci sono i dom ready è $ (function() {}) È la versione a mano corta di jQuery. per l'evento click fare riferimento a questo jsfiddle. http://jsfiddle.net/QgeD9/ – laymanje

Invece del onclick in html, ho assegnato tutto tramite id nel codice Jquery.

Non sono sicuro di voler sapere se il div è selezionato o se la casella è selezionata. Ho inserito il controllo di input nel codice e ho commentato il codice se il div è stato cliccato.

<!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>

fonte

2012-05-18 20:19:30 Patriotec

È possibile ottenere questo errore con JavaScript in Firefox e Chrome:

Uncaught ReferenceError: $ is not defined.

Se hai incluso jquery in questo modo:

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

e il server è configurato per non consentire javascript contenuti da scaricare ed eseguire in fase di esecuzione, quindi si ottiene l'errore di cui sopra. Date un'occhiata a tutta errore:

[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

Che cosa significa è il server web non consente JavaScript contenuto da caricare al volo. È un rischio per la sicurezza perché qualcuno potrebbe iniettare cose malvagie lì per il download e possedere i tuoi server.

fonte

2013-11-28 03:40:35

Nessuno dei precedenti era applicabile per me su Chrome 49. ho dovuto specificare il tipo "application/javascript" in questo modo:

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

Utilizzando "text/javascript" non funzionava.

fonte

2016-05-10 15:05:48 nepdev

ha davvero funzionato come un fascino :) provato molte soluzioni ma non è riuscito a trovare una soluzione come questa –

Chrome: Uncaught ReferenceError: $ non definito

risposta

Problemi correlati