Wordpress charge automatiquement jQuery. Je veux l'utiliser, mais j'obtiens:
jQuery n'est pas défini
Ceci est dû au fait que divers plugins perturbent l'ordre des scripts. Il n'y a donc aucune garantie que mon script se chargera APRÈS le chargement de jQuery. Donc, s'il se charge avant, j'obtiens cette erreur.
Puis-je envelopper mon script dans quelque chose qui attend le chargement de jQuery, puis exécute mon script?
Remarques
3 Réponses :
Toutes les fonctions de window.deferAfterjQueryLoaded seront exécutées après la définition de jQuery , donc si vous poussez toutes vos initialisations dans window.deferAfterjQueryLoaded vous peut être sûr qu'ils seront exécutés après jQuery
<script>
if (!window.deferAfterjQueryLoaded) {
window.deferAfterjQueryLoaded = [];
//delete Object.defineProperty; //add this if you want to check the support
if (typeof (Object.defineProperty) === "function") {
Object.defineProperty(window, "jQuery", {
set: function (value) {
window.setTimeout(function () {
$.each(window.deferAfterjQueryLoaded, function (index, fn) {
fn();
});
}, 0);
Object.defineProperty(window, "jQuery", {value: value});
},
configurable: true
});
} else {
nIntervId = window.setInterval(function () {
if (typeof (jQuery) !== "undefined") {
$.each(window.deferAfterjQueryLoaded, function (index, fn) {
fn();
});
clearInterval(nIntervId);
}
}, 10);
}
}
window.deferAfterjQueryLoaded.push(function () {
(function ($) {
console.log("After jquery is loaded");
})(jQuery);
});
</script>
<script>
window.deferAfterjQueryLoaded.push(function () {
(function ($) {
console.log("After jquery is do something else");
})(jQuery);
});
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
Vous pouvez en savoir plus abount Object.defineProperty , vous pouvez vérifier la prise en charge de plusieurs navigateurs ici p >
Merci - ça a l'air intéressant, je le teste maintenant ... Savez-vous si cela prend en charge plusieurs navigateurs?
J'ai ajouté un lien pour que vous puissiez le vérifier, j'essaie d'apporter des modifications à l'extrait de code, afin que vous puissiez couvrir les navigateurs qui ne prennent pas en charge Object.defineProperty
Je ne pense pas qu'il soit nécessaire que vous ayez un polyfill en fin de page developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/...
J'ai changé l'extrait de code, jquery 3.3.1 utilise Object.defineProperty donc j'ai changé en 1.11.1
Peut-être que cela aide:
$j = jQuery.noConflict();
Ensuite, utilisez $ j
Tom
Le problème est que jQuery n'est même pas encore chargé - ce n'est pas un problème de non-conflit.
D'accord. J'ai eu cette erreur (non définie) parfois et je l'ai résolue comme ça. Mais en général, je ne déplace pas jQuery.
Oui, dans ce cas, c'est parce que Wordpress exécute jquery en mode sans conflit, vous devez donc utiliser jQuery au lieu de $ . Mais cela suppose que jQuery est déjà chargé, donc il résout un problème connexe mais différent.
À mon humble avis, lorsque 'load' est déclenché, vous pouvez utiliser jQuery:
window.addEventListener('load', (event) => {
// your code
});
Je pensais faire exactement cela parce que c'est si simple / facile ... Mais savez-vous si cela prend en charge plusieurs navigateurs? D'après mon expérience, quand quelque chose est si simple, c'est parce que les anciens navigateurs méchants ne le supportent pas :)
Oui, il a un très bon support de navigateur, s'il vous plaît voir: développeur.mozilla .org / fr-nous / docs / web / API / fenêtre / load_event Vous pouvez également utiliser window.onload = fonction () {/ * Votre code * /};
Voir aussi attendre le chargement de jQuery
@Adder Merci. Mais cela parle d'utiliser
defer, que je ne peux pas contrôler car Wordpress contrôle jquery, et de document ready qui n'est pas pertinent car jquery n'est pas encore chargé.