IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

[DOM] innerHTML, changement d'image, IE pas ok


Sujet :

JavaScript

  1. #1
    Membre du Club
    Profil pro
    Inscrit en
    Décembre 2003
    Messages
    120
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Décembre 2003
    Messages : 120
    Points : 50
    Points
    50
    Par défaut [DOM] innerHTML, changement d'image, IE pas ok
    Bonjour,

    J'ai un probleme avec IE pour changer grace à une fonction javascript le contenu d'une div avec une image. Tout fonctionne tres bien avec FireFox et à moitié avec IE
    Par à moitié j'entends que l'image n'apparait pas sous IE, mais que par contre l'espace qu'elle devrait occupée est bien apparent, que si je clique droit et fait "afficher l'image" elle apparait bien. En fait, IE semble ne pas recharger correctement le contenu de la div pour faire l'affichage. Le code est correctement exécuté, mais l'affichage lui non.
    Si vous avez une idée je suis preneur.
    Merci

  2. #2
    Membre émérite Avatar de Madfrix
    Profil pro
    Inscrit en
    Juin 2007
    Messages
    2 326
    Détails du profil
    Informations personnelles :
    Localisation : France, Gironde (Aquitaine)

    Informations forums :
    Inscription : Juin 2007
    Messages : 2 326
    Points : 2 566
    Points
    2 566
    Par défaut
    Il nous faudrait ton code pour qu'on puisse t'aider

  3. #3
    Membre du Club
    Profil pro
    Inscrit en
    Décembre 2003
    Messages
    120
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Décembre 2003
    Messages : 120
    Points : 50
    Points
    50
    Par défaut
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    function changePic(idDiv, url){
     
     
      var html = "<img src=\"" + url + "\">";
     
     document.getElementById(idDiv).innerHTML = html;
     
    }
    Cette fonction fonctionne tres bien en terme de code pour FF et IE, mais l'affichage n'est correcte qu'avec FF, pas avec IE, pour lequel je dois forcer le rafraichissement avec un clique droit souris "afficher l'image".

  4. #4
    Membre émérite Avatar de Madfrix
    Profil pro
    Inscrit en
    Juin 2007
    Messages
    2 326
    Détails du profil
    Informations personnelles :
    Localisation : France, Gironde (Aquitaine)

    Informations forums :
    Inscription : Juin 2007
    Messages : 2 326
    Points : 2 566
    Points
    2 566
    Par défaut
    C'est bizarre le code me semble correct en plus je viens de le tester sous IE 6 et l'image s'affiche sans que l'on ai besoin de la rafraichir ...

  5. #5
    Rédacteur
    Avatar de bigboomshakala
    Homme Profil pro
    Consultant Web .NET
    Inscrit en
    Avril 2004
    Messages
    2 077
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 44
    Localisation : France, Val de Marne (Île de France)

    Informations professionnelles :
    Activité : Consultant Web .NET
    Secteur : Finance

    Informations forums :
    Inscription : Avril 2004
    Messages : 2 077
    Points : 2 757
    Points
    2 757
    Par défaut
    et avec du DOM ?

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    function changePic(idDiv, url){
     
     
      var img = document.createElement('IMG');
      img.src = url;
     
      document.getElementById(idDiv).appendChild(img);
     
    }
    de tête

  6. #6
    Membre du Club
    Profil pro
    Inscrit en
    Décembre 2003
    Messages
    120
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Décembre 2003
    Messages : 120
    Points : 50
    Points
    50
    Par défaut
    Merci pour l'idée, je vais tester ca de suite et vous tiens au courant.

  7. #7
    Membre du Club
    Profil pro
    Inscrit en
    Décembre 2003
    Messages
    120
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Décembre 2003
    Messages : 120
    Points : 50
    Points
    50
    Par défaut
    Bon j'ai essayé et j'ai exactement le même probleme.
    Sous FF c'est nickel et sous IE je vois juste apparaitre la zone ou devrait s'afficher l'image mais pas l'image. Je suis obligé de forcer on affichage pour la voir.
    Je comprends vraiment pas.

  8. #8
    Membre émérite Avatar de Madfrix
    Profil pro
    Inscrit en
    Juin 2007
    Messages
    2 326
    Détails du profil
    Informations personnelles :
    Localisation : France, Gironde (Aquitaine)

    Informations forums :
    Inscription : Juin 2007
    Messages : 2 326
    Points : 2 566
    Points
    2 566
    Par défaut
    J'ai une autre solution à te proposer mais c'est un peu de la bidouille

    Pourquoi ne pas créer une iframe dans ton div occupant la totalité de la place (width et height à 100%) ?

    Tu pourrais ainsi injecter l'image dans l'iframe et non plus passer par un getElementByID...

  9. #9
    Rédacteur
    Avatar de bigboomshakala
    Homme Profil pro
    Consultant Web .NET
    Inscrit en
    Avril 2004
    Messages
    2 077
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 44
    Localisation : France, Val de Marne (Île de France)

    Informations professionnelles :
    Activité : Consultant Web .NET
    Secteur : Finance

    Informations forums :
    Inscription : Avril 2004
    Messages : 2 077
    Points : 2 757
    Points
    2 757
    Par défaut
    moi j'ai pas de pb, sauf qu'il faut supprimer l'ancienne image

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    function changePic(idDiv, url){
     
     
      var img = document.createElement('IMG');
      img.src = url;
     
     	document.getElementById(idDiv).removeChild(document.getElementById(idDiv).children(0));
      document.getElementById(idDiv).appendChild(img);
     
    }

  10. #10
    Membre du Club
    Profil pro
    Inscrit en
    Décembre 2003
    Messages
    120
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Décembre 2003
    Messages : 120
    Points : 50
    Points
    50
    Par défaut
    Salut,

    Je vais essayer en supprimant l'ancienne, efefctivement ca peut faire une diff !

    Merci et à bientot pour la suite ;-)

  11. #11
    Expert éminent sénior
    Avatar de Auteur
    Profil pro
    Inscrit en
    Avril 2004
    Messages
    7 649
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2004
    Messages : 7 649
    Points : 11 138
    Points
    11 138
    Par défaut
    bonjour,

    pourquoi vous casser la tête à supprimer une image pour en créer une autre au même endroit

    Code javascript : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
     
    document.getElementById("idImage").src = url;
    devrait suffire non ?

  12. #12
    Rédacteur
    Avatar de bigboomshakala
    Homme Profil pro
    Consultant Web .NET
    Inscrit en
    Avril 2004
    Messages
    2 077
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 44
    Localisation : France, Val de Marne (Île de France)

    Informations professionnelles :
    Activité : Consultant Web .NET
    Secteur : Finance

    Informations forums :
    Inscription : Avril 2004
    Messages : 2 077
    Points : 2 757
    Points
    2 757
    Par défaut
    muhaha j'étais au taf jme suis pas posé de question j'ai servi la version DOM de la fonction initiale...

  13. #13
    Membre confirmé
    Homme Profil pro
    Inscrit en
    Avril 2005
    Messages
    614
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 41
    Localisation : Turquie

    Informations forums :
    Inscription : Avril 2005
    Messages : 614
    Points : 502
    Points
    502
    Par défaut
    ta résolu ton pb sunshine33 ?

    si c'est le cas j'aimerai bien avoir ta solution.

    merci

  14. #14
    Membre confirmé
    Homme Profil pro
    Inscrit en
    Avril 2005
    Messages
    614
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 41
    Localisation : Turquie

    Informations forums :
    Inscription : Avril 2005
    Messages : 614
    Points : 502
    Points
    502
    Par défaut
    où si qlq'un d'autre à une solution ?
    mon dom ressemble à çà
    <div><a><img /></a>

    donc moi je supprime tout ce qui est à l'intérieure de <div> pour le regenéré en javascript.

    sous ie7 et firefox aucun probleme, mais ie6 ne recharche pas l'image, ou peut etre qu'une fois sur 10

    je m'arrache les cheveux la dessus donc si qlq'un à une soluce qu'il aurai déjà tester çà me serai utile.

  15. #15
    Expert éminent sénior
    Avatar de Auteur
    Profil pro
    Inscrit en
    Avril 2004
    Messages
    7 649
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2004
    Messages : 7 649
    Points : 11 138
    Points
    11 138
    Par défaut
    Les solutions proposées ne te conviennent pas ? Où ça bloque ?

  16. #16
    Membre confirmé
    Homme Profil pro
    Inscrit en
    Avril 2005
    Messages
    614
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 41
    Localisation : Turquie

    Informations forums :
    Inscription : Avril 2005
    Messages : 614
    Points : 502
    Points
    502
    Par défaut
    les solutions fonctionne sous ie7 et firefox mais pas sous ie6

    le truc c'est que moi je travail en ajax, et l'url que je donne fait suite à un traitement en ajax, bon ok le pb devrai etre le meme mais dans mon cas çà fonctionne pas.

    par contre la chose qui m'intrigue c'est que si je fait un alert juste apres l'affichage de mon image alors dans ce cas l'image s'affiche

    si vous avez des pistes je suis preneur, je bloque vraiment là

  17. #17
    Membre expert
    Avatar de FremyCompany
    Profil pro
    Étudiant
    Inscrit en
    Février 2006
    Messages
    2 532
    Détails du profil
    Informations personnelles :
    Âge : 32
    Localisation : Belgique

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Février 2006
    Messages : 2 532
    Points : 3 239
    Points
    3 239
    Par défaut
    Si c'est un problème de cache, tu peux incrementer une variable et la passer comme argument à l'URL

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    function setURL_nocache(img, url) {
     if(!img.cache) {
      img.cache = 0;
     } else { img.cache++; }
     img.src=url + "?cacheIndex=" + img.cache;
    }
    Fremy
    Pour vos développements Web et une navigation agréable, le tout gratuit :
    1) IE 8 + IE7Pro (Si vous ne connaissez pas IE7Pro, essayez !)
    2) FF 3 + Web Developper Toolbar + AdBlockPlus + FireBug + GreaseMonkey

  18. #18
    Membre confirmé
    Homme Profil pro
    Inscrit en
    Avril 2005
    Messages
    614
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 41
    Localisation : Turquie

    Informations forums :
    Inscription : Avril 2005
    Messages : 614
    Points : 502
    Points
    502
    Par défaut
    j'ai déjà essayer cette solution avec la class Date.

    çà marche toujours pas.

  19. #19
    Membre du Club
    Profil pro
    Inscrit en
    Décembre 2003
    Messages
    120
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Décembre 2003
    Messages : 120
    Points : 50
    Points
    50
    Par défaut
    Bonjour,

    Bon toutes les solutions proposées ne fonctionnent pas. Ce n'est pas la justesses des réponses qui sont à mettre en doute, elles sont toutes jsutes je pense. Je vois bien dans IE que le contenu de la div a changé, ne serait ce que par la palce qu'elle occuppe. Le problème est que le contenu, l'imge donc, n'est pas affichée. Il faut forcer son affichage par le code si c'est possible. En effet, je rappel qu'un clic droit de la souris "afficher l'image" force l'affichage de l'image.
    Donc changer le contenu de la div pas de prob, que ce soit par eds innerHTML ou par le DOM etc. mais rendre visible ce nouveau contenu (l'image) ne semble pas fonctionner dans mon cas.

    En tout cas merci pour la participation de tout le monde !

  20. #20
    Membre expert
    Avatar de FremyCompany
    Profil pro
    Étudiant
    Inscrit en
    Février 2006
    Messages
    2 532
    Détails du profil
    Informations personnelles :
    Âge : 32
    Localisation : Belgique

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Février 2006
    Messages : 2 532
    Points : 3 239
    Points
    3 239
    Par défaut
    Et faire un display = "none"; setTimeout("...display=''", 0)

    (le setTimeout est important car il va permettre d'effectuer le changement de style dans un autre thread JS donc le none va s'appliquer sinon, comme IE attends la fin du thread pour mettre à jour l'UI, le none ne sera pas pris en compte)
    Fremy
    Pour vos développements Web et une navigation agréable, le tout gratuit :
    1) IE 8 + IE7Pro (Si vous ne connaissez pas IE7Pro, essayez !)
    2) FF 3 + Web Developper Toolbar + AdBlockPlus + FireBug + GreaseMonkey

Discussions similaires

  1. changement d'image qui ne se fait pas !
    Par Franensg dans le forum Tkinter
    Réponses: 0
    Dernier message: 14/07/2009, 10h41
  2. [DOM] innerHtml ne met pas le texte où je voudrais
    Par knice dans le forum Général JavaScript
    Réponses: 5
    Dernier message: 30/09/2008, 11h36
  3. Réponses: 2
    Dernier message: 26/07/2005, 21h44
  4. Changement d'image si l'originale absente
    Par MitchDap dans le forum Général JavaScript
    Réponses: 8
    Dernier message: 16/03/2005, 09h06
  5. changement d'image par radio boutton
    Par ph_anrys dans le forum Général JavaScript
    Réponses: 5
    Dernier message: 14/03/2005, 16h27

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo