jQuery.load() ne fonctionne pas sur IE : SOLUTION 6

Vous avez sûrement déjà utilisé la fonction jQuery.load() et remarqué que ça ne fonctionne pas tout à fait comme prévu sur IE.

En effet, même si ça vous affiche parfois correctement votre chargement quand vous appuyez sur F5, souvent lorsque vous tentez d’afficher votre page via un lien, rien n’a l’air de se passer. C’est parce que IE essaye de servir la page via du cache, et ça ne fait pas bon ménage avec le chargement AJAX.

Pour contrer ça, on va faire comme d’habitude : ajouter un nombre au bout de notre fichier.
Souvent en PHP, on utilise ceci :

echo '<img src="'.$fichier.'?'.time().'" alt="" />';

Personnellement, j’ai un peu de mal avec les fonctions de date et heure de JavaScript, on fera donc un simple Math.random() ^^

Code inital qui pose problème :

$('#myid img').load(function() {
    $('.slide').animate({'opacity' : '1'});
});

Correction :

$('#myid').load('img' +  Math.random()*99999, function() {
    $('.slide').animate({'opacity' : '1'});
});

Ce code a été testé sur IE 8, 9 et 10 sur leur OS respectif (WIN XP, Win 7 et Win 8) et est parfaite fonctionnel ! 🙂

6 thoughts on “jQuery.load() ne fonctionne pas sur IE : SOLUTION

  1. Reply Sousd Juil 23,2013 01:49

    Alors là mon chère Pierre … Je dois avouer que j’ai suivi ton tuto en étant persuadé que ça n’allait pas marché (désespoir).

    Et quand j’ai fait F5 et que j’ai vu que ça a marché, j’ai vidé le cache 5 fois pour être sur, mais c’est parfait !

    Merci, tu es impériale ^^

  2. Reply Schilling Norman Juil 23,2013 01:49

    Tu es désormais le papa du web.

    Je te remercie, pour cette information qui vaut de l’or à l’heure actuelle.

    Cordialement. À bientôt.

  3. Reply Pierre Juil 23,2013 08:02

    Merci beaucoup pour vos commentaires ! Ça fait plaisir de voir que mes notes servent à d’autres personnes 🙂

  4. Reply claudetom Oct 6,2016 22:52

    Bonjour,
    Ca semble fonctionner, mais cela créer une erreur Cross-domaine :
    sous chrome

    XMLHttpRequest cannot load file:***********/bin/img42550.79592946452. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.

    Cordialement.

    • Reply Pierre Oct 6,2016 22:56

      Bonjour,

      Il semblerait que vous fassiez de l’ajax sur 2 domaines différents (attention, les www. sont considérés comme 2 domaines différents).
      Si vous avez effectivement 2 domaines différents, il faut ajouter (dans le domaine appelé par AJAX et non le domaine où se trouve le script), dans le .htaccess:


      Header set Access-Control-Allow-Origin « * »

      Si ce ne sont pas 2 domaines différents, assurez-vous d’appeler les domaines de la même façon (avec ou sans www.)

      EDIT: je viens de relire mon post. Pour ce fix, il faut s’assurer que l’image soit sur le même domaine ou un domaine où on peut contrôler le .htaccess :/

Leave a Reply