Uncaught ReferenceError: $ n'est pas défini?
Comment se fait-il que ce code jette un
Uncaught ReferenceError: $ n'est pas défini
quand c'était bien avant?
$(document).ready(function() {
$('#tabs > ul').tabs({ fx: { opacity: 'toggle' } });
$('#featuredvid > ul').tabs();
});
Les résultats dans les onglets ne se ferment plus.
jQuery est référencé dans l'en-tête:
<script language="JavaScript" type="text/javascript" src="<?php echo get_option('siteurl') ?>/js/sprinkle.js"></script>
<script language="JavaScript" type="text/javascript" src="<?php echo get_option('siteurl') ?>/js/jquery-1.2.6.min.js"></script>
<script language="JavaScript" type="text/javascript" src="<?php echo get_option('siteurl') ?>/js/jquery-ui-personalized-1.5.2.packed.js"></script>
Vous devriez commencer par mettre en référence les scripts jQuery.
<script language="JavaScript" type="text/javascript" src="/js/jquery-1.2.6.min.js"></script>
<script language="JavaScript" type="text/javascript" src="/js/jquery-ui-personalized-1.5.2.packed.js"></script>
<script language="JavaScript" type="text/javascript" src="/js/sprinkle.js"></script>
Vous appelez la fonction ready avant que JavaScript de jQuery soit inclus. Référencez d'abord jQuery.
C'est ce qui l'a résolu pour moi. A l'origine, je suis allé sur Google et j'ai copié et collé l'extrait suggéré pour jQuery sur leur page CDN:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
L'extrait de code n'inclut pas le HTTP: ni le HTTPS: dans l'attribut src, mais mon navigateur, FireFox, en avait besoin. Je l'ai donc remplacé par: Edit: cela fonctionnait également pour moi avec Google Chrome.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
Ensuite cela a fonctionné.
Si votre script personnalisé est chargé avant le chargement du plug-in jQuery dans le navigateur, ce type de problème peut survenir. Donc, gardez toujours votre propre code JavaScript ou jQuery après avoir appelé le plugin jQuery, la solution est donc la suivante:
Ajoutez d’abord le lien au fichier jQuery hébergé sur GoogleApis ou à un fichier jQuery local que vous allez télécharger depuis http://jquery.com/download/ et héberger sur votre serveur:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
ou n'importe quel plugin pour jQuery. Ensuite, mettez votre lien ou code de fichier de script personnalisé:
<script src="js/custom.js" type="text/javascript"></script>
Dans mon cas, je mettais mon fichier .js avant le lien de script jQuery, en mettant le fichier .js après le lien de script jQuery a résolu mon problème.
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<script src="exponential.js"></script>
D'accord, mon problème était différent - il s'agissait de Document Security model in Chrome.
En regardant les réponses ici, il était évident que je ne chargeais pas mes fichiers jQuery avant d'appeler les fonctions $(document).ready() etc. Cependant, ils étaient tous dans les bonnes positions.
Dans mon cas, c’est parce que j’accédais au contenu via une connexion HTTPS sécurisée, alors que la page essayait de télécharger les données hébergées sur le CDN depuis Google, etc. CDN à chaque fois.
Edit: L'autre méthode consiste à créer un lien vers tous les éléments hébergés sur CDN en tant que https: // plutôt que http: // - le modèle ne se plaint pas.
Ajoutez la bibliothèque avant de lancer le script. Vous pouvez ajouter l’un des éléments suivants CDN pour le démarrer.
Google:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
Microsoft
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.2.1.min.js"></script>
Jquery
Si vous voulez une autre version cdn de Jquery, cochez lien .
Après ça:
<script type="text/javascript">
$(function(){
//your stuff
});
or
$(document).ready(function(){
//your stuff
});
</script>
Wordpress:
<script type="text/javascript">
var $ = jQuery;
jQuery(document).ready(function($){
//your stuff
});
</script>
Si c'est dans wordpress, il faudra peut-être changer
$(document).ready(function() {
à
jQuery(document).ready(function($){
ou ajouter
var $ = jQuery;
avant
$(document).ready(function() {
Dans mon cas, j'avais l'erreur referenceError car l'ordre des appels de script était incorrect. Résolu cela en changeant l'ordre:
<script src="js/index.js"></script>
<script src="js/jquery-1.10.2.js"></script>
à
<script src="js/jquery-1.10.2.js"></script>
<script src="js/index.js"></script>
J'ai eu exactement le même problème et aucune des solutions ci-dessus n'a aidé . Cependant, je viens de lier les fichiers .css après les fichiers .js et le problème a miraculeusement disparu. J'espère que cela t'aides.
Je suis probablement la seule personne à avoir eu ce genre de problème, mais je l’ai mal fait quand même. Je voulais essayer de rendre mon script asynchrone juste pour le plaisir. Ensuite, je l'ai oublié et quand je suis parti vivre, le fichier [custom] .js n'était chargé que 50% du temps avant le jQuery.js.
Alors j'ai changé
<script async src="js/script.js"></script>
à
<script src="js/script.js"></script>
:)
Si vous le faites dans .Net et que le fichier de script est correctement référencé et que jQuery se présente bien, assurez-vous que vos utilisateurs ont accès au fichier de script. Le projet sur lequel je travaillais (un collègue) avait son web.config qui interdisait l’accès à des utilisateurs anonymes. La page sur laquelle je travaillais était accessible aux utilisateurs anonymes. Ils n'avaient donc pas accès au fichier de script. Laissé le suivant dans le web.config et tout était bien dans le monde:
<location path="Scripts">
<system.web>
<authorization>
<allow users="*"/>
</authorization>
</system.web>
</location>
Cela m'est arrivé avant.
La raison était que je connectais Android à une vue Web avec un JS. Et j'ai envoyé un paramètre sans guillemets.
js.sayHello(hello);
et quand je l'ai changé pour
js.sayHello('hello');
ça a marché.
Le fichier source jquery-1.2.6.min.js n'est pas appelé. La commande jQuery $() est exécutée avant <..src='jquery-1.2.6.min.js'>.
Veuillez d'abord exécuter <.. src="/js/jquery-1.2.6.min.js.."> et assurez-vous que le chemin d'accès src est correct, puis exécutez la commande jquery
$(document).ready(function()
Dans mon cas, c’était une faute de frappe, j’ai oublié une barre oblique inverse et je ne faisais pas correctement référence à la source.
Avant src="/scripts/jquery.js"
Après src="scripts/jquery.js"
Votre fichier JavaScript est manquant alors cette erreur est survenue. Ajoutez simplement le fichier JavaScript dans la balise <head>. Voir l'exemple:
<script src="js/sample.js" type="text/javascript"></script>
<link href="css/sample.css" rel="stylesheet" type="text/css" />
ou ajoutez le code suivant dans la balise:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
L'erreur se produira également dans les deux scénarios suivants.
- L'élément @section scripts est manquant dans le fichier HTML
- Erreur lors de l'accès aux éléments du DOM. Par exemple, l'accès à l'élément DOM est mentionné en tant que $ ("js-toggle") au lieu de $ (". Js-toggle"). En fait, la période est manquante
Donc, 3 choses à suivre - les scripts de vérification requis sont ajoutés, vérifiez s'il est ajouté dans l'ordre requis et les troisièmes erreurs de syntaxe dans votre script Java.
Doh! J'avais mélangé des citations dans mes balises qui ont causé la rupture de la référence jQuery. Faire une inspection dans Chrome m'a permis de voir que le fichier n'était pas correctement lié.
Dans mon cas, j'ai oublié d'inclure ceci:
<script src ="jquery-2.1.1.js"></script>
Auparavant, je n'incluais que jquery-mobile qui était à l'origine de cette erreur.
Ok j'avoue que celui-ci était une chose vraiment stupide qui m'est arrivé une fois. J'ai modifié la balise de script pour qu'elle pointe vers le bon contenu et j'ai modifié l'ordre de script pour qu'elle devienne la bonne dans l'éditeur ... mais j'ai totalement oublié de sauvegarder le changement; des problèmes peuvent se produire.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script type="text/javascript" src="local_xxx.js"></script>
J'ai un problème similaire, et vous savez quoi, c'est à cause de le réseau est déconnecté lorsque je teste dans la visualisation Web de l'appareil Android et que je ne m'en rends pas compte, le js local ne pose aucun problème car il n'a pas besoin de réseau . Cela semble ridicule, mais cela me fait perdre environ 1 heure.
J'avais un problème similaire et c'était parce qu'il me manquait une fermeture> sur un lien de feuille de style.
J'ai eu le même problème, et j'ai résolu en plaçant jQuery en haut de tous les codes javascript que j'ai dans mon code.
Quelque chose comme ça:
<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
<script src="js/app.js" type="text/javascript"></script>
<script src="js/form.js" type="text/javascript"></script>
<script src="js/create.js" type="text/javascript"></script>
<script src="js/tween.js" type="text/javascript"></script>
L'espoir peut aider quelqu'un à l'avenir.
Chose étrange, mon problème venait de PHP.
Un appel d'API REST échouait et interrompait le chargement des bibliothèques par la suite. Comme l’échec provenait de l’appel REST, cela ne me donnait pas d’erreur de compilation php.
Conservez cette option également, si le chargement de jquery semble correct.
Vous appelez la fonction ready avant que JavaScript de jQuery soit inclus. Référencez d'abord jQuery.
Si vous êtes dans ASP.NET MVC, vous pouvez spécifier quand votre code JS doit être rendu, en procédant comme suit:
1, Dans votre page.cshtml, placez votre balise <script> dans une section et attribuez-lui un nom. Le nom commun à utiliser est 'scripts':
@section scripts {
<script>
// JS code...
</script>
}
2, Dans votre page _Layout.cshtml, ajoutez @RenderSection("Scripts", required: false), assurez-vous de le mettre après avoir référencé la source Jquery, votre code JS sera rendu plus tard que Jquery.
J'ai eu ce problème lorsque je naviguais sur Internet via mon point d'accès mobile. il comprenait également des images et ajoutait le script suivant au bas de la balise body
<script language="javascript"><!--
bmi_SafeAddOnload(bmi_load,"bmi_orig_img");//-->
</script>
Lorsque je me suis connecté à la bonne connexion wifi, tout semble fonctionner pour moi. J'espère que cela aidera quelqu'un.
Cela peut aussi arriver s'il y a un problème de réseau. Ce qui signifie que même si les "scripts jquery" sont en place et ont été inclus avant leur utilisation, les scripts jquery n'étant pas accessibles, au moment du chargement de la page, les définitions de "$" sont traitées comme "références indéfinies".
FOR TEST/DEBUG PURPOSES :: Vous pouvez essayer d'accéder à l'URL "jquery-script" sur le navigateur. Si elle est accessible, votre page devrait se charger correctement, sinon elle affichera ladite erreur (ou d’autres erreurs relatives au script). Exemple - http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js devrait être accessible, sur le navigateur (ou les positions de contexte du navigateur).
J'ai eu un problème similaire, dans lequel je pouvais charger la page HTML (en utilisant des scripts) dans mon navigateur Windows-Host, mais ne pouvais pas charger dans VM-Ubuntu. Résoudre le problème de réseau, le problème a été résolu.
J'ai eu le même problème. Mon serveur de test fonctionnait bien avec "http". Cependant, il a échoué en production avec SSL.
Ainsi, en production, j'ai ajouté "HTPPS" au lieu de "HTTP" et en test, j'ai gardé le mot "HTTP".
Tester:
wp_register_script ('jquery', ' http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js ', array (), null, false);
wp_register_script ('custom-script', plugins_url ('/js/custom.js', fichier ), array ('jquery'));
Production:
wp_register_script ('jquery', ' https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js ', array (), null, false);
wp_register_script ('custom-script', plugins_url ('/js/custom.js', fichier ), array ('jquery'));
J'espère que cela aidera quelqu'un qui travaille sur Wordpress.
var $ = jQuery;
jQuery(document).ready(function($){
Le problème racine est une ReferenceError. MDN indique qu'un bloc try/catch est l'outil approprié pour le travail. Dans mon cas, une erreur de référence non interceptée se présentait pour un sdk/une bibliothèque de paiement. Le ci-dessous fonctionne pour moi.
try {
var stripe = Stripe('pk_test_---------');
} catch (e) {
stripe = null;
}
if(stripe){
//we are good to go now
}
Évidemment, le correctif consiste à charger n'importe quel SDK/bibliothèque, par exemple. jQuery, avant d'appeler ses méthodes mais la variable try/catch empêche votre code JavaScript partagé de bloquer les erreurs si vous exécutez ce script partagé sur une page qui ne charge pas la bibliothèque que vous utilisez sur un sous-ensemble de pages.
Vous n'avez pas référencé une bibliothèque jQuery.
Vous devrez inclure une ligne similaire à celle-ci dans votre code HTML:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
Dans mon cas, le problème a été résolu après l'installation du "contenu statique" du service de rôle Windows Server. (SE: Windows Server 2008 R2)
Comment installer le service de rôle serveur 'Contenu statique':
- (En supposant que le rôle "Web Server" soit déjà installé)> Exécuter le Gestionnaire de serveur> Cliquez sur "Rôles" dans le volet de gauche> cliquez sur "Ajouter des services de rôle" dans la zone "Serveur Web" dans le volet de droite> sélectionnez "Contenu statique" sous " Serveur Web/Fonctionnalités HTTP communes '> Cliquez sur' Suivant '> ...