jQuery Girl
  1. jQuery Girl
  3. Charger dynamicment jQuery dans IE et Chrome
Intereting Posts
Comment afficher / masquer de manière dynamic des lignes dans un tableau Recharger datatable sans recharger la page? AngularJs: Sélectionnez une valeur dans DropDown Comment obtenir un travail de saisie semi-automatique de l’interface utilisateur JQuery avec l’ID d’élément Est-ce que l’événement jQuery mouseup fonctionne sur les appareils tactiles? Comment changer le nom de la colonne dans le sélecteur de colonne qui apparaît dans jqgrid? Slickgrid enregistre toutes les données à la fois Comment désactiver les barres de défilement d’une page? Plage personnalisée / Ensemble variable avec curseur de l’interface utilisateur jQuery Existe-t-il un moyen de limiter la saisie automatique Google Adresses à la recherche dans les rues d’une ville? jQuery UI comment définir une option de confinement déplaçable sur le parent du parent Impossible de changer la valeur du bouton avec ajax Animer sur scroll avec jQuery Question sur SimpleModal jQuery plugin – possible de se recentrer après la première ouverture? Je ne trouve pas où j’ai une boucle Popstate créant plusieurs entrées d’historique

Charger dynamicment jQuery dans IE et Chrome

Je crée un widget externe qui utilise jQuery et plutôt que de l’inclure séparément, j’aimerais vérifier s’il est chargé et le charger dynamicment si ce n’est pas le cas.

Le problème est que je dois attendre le chargement du script pour exécuter le rest du script, ce qui nécessite des gestionnaires d’événements que IE et FF / Chrome gèrent différemment.

Si je le fais, cela fonctionne bien dans IE8: 

  if (typeof jQuery == 'undefined') { s = document.createElement("script"); s.src = "//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"; if (s.addEventListener) { s.addEventListener("load", runScript, false); } else if (s.readyState) { s.onreadystatechange = runScript; } } else { runScript(); } function runScript() { document.getElementsByTagName('head')[0].appendChild(s); $('#test').css('font-size', '50px'); }

Mais cela ne fonctionne pas dans Chrome. Cependant, si j’ajoute le script précédemment, cela fonctionne dans Chrome mais pas dans IE: 

 
 
This is a test.
 
  if (typeof jQuery == 'undefined') { s = document.createElement("script"); s.src = "//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"; document.getElementsByTagName('head')[0].appendChild(s); if (s.addEventListener) { s.addEventListener("load", runScript, false); } else if (s.readyState) { s.onreadystatechange = runScript; } } else { runScript(); } function runScript() { $('#test').css('font-size', '50px'); }

Des idées sur la façon de charger dynamicment jQuery avec des gestionnaires d’événements fonctionnant à la fois dans IE et Chrome?

EDIT: La cible appendChild est passée de test à head.

Dans le premier code, vous ajoutez le script à la fonction que vous appelez une fois l’opération terminée!

Et quel élément est test? 

 document.getElementsByTagName('test')[0].appendChild(s); <-- looking for element 
 <-- test is an id

Le code devrait ressembler à 

 if (typeof jQuery == 'undefined') { var s = document.createElement("script"); s.src = "//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"; if (s.addEventListener) { s.addEventListener("load", runScript, false); } else if (s.readyState) { s.onreadystatechange = runScript; } document.getElementsByTagName('head')[0].appendChild(s); } else { runScript(); } function runScript() { $('#test').css('font-size', '50px'); }

Exemple en cours d'exécution: http://jsfiddle.net/5986T/