Est-ce que quelqu'un sait comment vérifier si jquery a été chargé (avec javascript) puis le charger s'il n'a pas été chargé.
quelque chose comme
if(!jQuery) {
//load jquery file
}
Peut-être quelque chose comme ça:
<script>
if(!window.jQuery)
{
var script = document.createElement('script');
script.type = "text/javascript";
script.src = "path/to/jQuery";
document.getElementsByTagName('head')[0].appendChild(script);
}
</script>
Évitez d’utiliser "if (! JQuery)" car IE renverra l’erreur: jQuery est 'undefined'
À la place, utilisez: if (typeof jQuery == 'undefined')
<script type="text/javascript">
if (typeof jQuery == 'undefined') {
var script = document.createElement('script');
script.type = "text/javascript";
script.src = "http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js";
document.getElementsByTagName('head')[0].appendChild(script);
}
</script>
Vous devrez également vérifier si JQuery a été chargé après l'avoir ajouté à l'en-tête. Sinon, vous devrez attendre l'événement window.onload, qui est plus lent si la page contient des images. Voici un exemple de script qui vérifie si le fichier JQuery est chargé car vous n’aurez pas la commodité de pouvoir utiliser $ (document) .ready (fonction ...
http://neighborhood.org/core/sample/jquery/append-to-head.htm
Méthode 1:
if (window.jQuery) {
// jQuery is loaded
} else {
// jQuery is not loaded
}
Méthode 2:
if (typeof jQuery == 'undefined') {
// jQuery is not loaded
} else {
// jQuery is loaded
}
Si le fichier jquery.js n'est pas chargé, nous pouvons le charger de la manière suivante:
if (!window.jQuery) {
var jq = document.createElement('script'); jq.type = 'text/javascript';
// Path to jquery.js file, eg. Google hosted version
jq.src = '/path-to-your/jquery.min.js';
document.getElementsByTagName('head')[0].appendChild(jq);
}
Essaye ça :
<script>
window.jQuery || document.write('<script src="js/jquery.min.js"><\/script>')
</script>
Ceci vérifie si jQuery est disponible ou non, sinon il en ajoutera un de manière dynamique à partir du chemin spécifié.
Ref: Simule un "include_once" pour jQuery
OR
include_once équivalent pour js. Réf.: https://raw.github.com/kvz/phpjs/master/functions/language/include_once.js
function include_once (filename) {
// http://kevin.vanzonneveld.net
// + original by: Legaev Andrey
// + improved by: Kevin van Zonneveld (http://kevin.vanzonneveld.net)
// + improved by: Michael White (http://getsprink.com)
// + input by: Brett Zamir (http://brett-zamir.me)
// + bugfixed by: Kevin van Zonneveld (http://kevin.vanzonneveld.net)
// + bugfixed by: Brett Zamir (http://brett-zamir.me)
// - depends on: include
// % note 1: Uses global: php_js to keep track of included files (though private static variable in namespaced version)
// * example 1: include_once('http://www.phpjs.org/js/phpjs/_supporters/pj_test_supportfile_2.js');
// * returns 1: true
var cur_file = {};
cur_file[this.window.location.href] = 1;
// BEGIN STATIC
try { // We can't try to access on window, since it might not exist in some environments, and if we use "this.window"
// we risk adding another copy if different window objects are associated with the namespaced object
php_js_shared; // Will be private static variable in namespaced version or global in non-namespaced
// version since we wish to share this across all instances
} catch (e) {
php_js_shared = {};
}
// END STATIC
if (!php_js_shared.includes) {
php_js_shared.includes = cur_file;
}
if (!php_js_shared.includes[filename]) {
if (this.include(filename)) {
return true;
}
} else {
return true;
}
return false;
}
Même si vous avez une tête qui l'ajoute, cela peut ne pas fonctionner dans tous les navigateurs. C’est la seule méthode que j’ai trouvée pour travailler de manière constante.
<script type="text/javascript">
if (typeof jQuery == 'undefined') {
document.write('<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"><\/script>');
}
</script>
Vous pouvez vérifier si jQuery est chargé ou non de plusieurs manières, telles que:
if (typeof jQuery == 'undefined') {
// jQuery IS NOT loaded, do stuff here.
}
if (typeof jQuery == 'function')
//or
if (typeof $== 'function')
if (jQuery) {
// This will throw an error in STRICT MODE if jQuery is not loaded, so don't use if using strict mode
alert("jquery is loaded");
} else {
alert("Not loaded");
}
if( 'jQuery' in window ) {
// Do Stuff
}
Maintenant, après avoir vérifié si jQuery n'est pas chargé, vous pouvez charger jQuery comme ceci:
Bien que cette partie a été répondu par beaucoup dans ce post, mais toujours répondre pour que le code soit complet
// This part should be inside your IF condition when you do not find jQuery loaded
var script = document.createElement('script');
script.type = "text/javascript";
script.src = "http://code.jquery.com/jquery-3.3.1.min.js";
document.getElementsByTagName('head')[0].appendChild(script);
var f = ()=>{
if (!window.jQuery) {
var e = document.createElement('script');
e.src = "https://code.jquery.com/jquery-3.2.1.min.js";
e.onload = function () {
jQuery.noConflict();
console.log('jQuery ' + jQuery.fn.jquery + ' injected.');
};
document.head.appendChild(e);
} else {
console.log('jQuery ' + jQuery.fn.jquery + '');
}
};
f();
<script>
if (typeof(jQuery) == 'undefined'){
document.write('<scr' + 'ipt type="text/javascript" src=" https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></scr' + 'ipt>');
}
</script>
Ancien post mais j'ai fait une bonne solution ce qui est testé sur les lieux serval.
https://github.com/CreativForm/Load-jQuery-if-it-is-not-already-loaded
CODE:
(function(url, position, callback){
// default values
url = url || 'https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js';
position = position || 0;
// Check is jQuery exists
if (!window.jQuery) {
// Initialize <head>
var head = document.getElementsByTagName('head')[0];
// Create <script> element
var script = document.createElement("script");
// Append URL
script.src = url;
// Append type
script.type = 'text/javascript';
// Append script to <head>
head.appendChild(script);
// Move script on proper position
head.insertBefore(script,head.childNodes[position]);
script.onload = function(){
if(typeof callback == 'function') {
callback(jQuery);
}
};
} else {
if(typeof callback == 'function') {
callback(jQuery);
}
}
}('https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js', 5, function($){
console.log($);
}));
Chez GitHub, c’est une meilleure explication, mais généralement cette fonction peut être ajoutée n’importe où dans votre code HTML et vous initialiserez jquery si ce n’est pas déjà chargé.