11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

J'utilise un javascript qui fonctionne très bien sous tous les navigateurs sauf IE. Ce qui est étonnant c'est que la console d'erreur n'indique rien.

Soit une image toute simple : <img src="img/sport-foot.png" id="myImage" alt="sport">

et un code javascript aussi simple :

<script type="text/javascript">
  function SwapImage(imgNom) {
    document.getElementById('myImage').src = "img/sport-" + imgNom + ".png";
  }
</script>

qui fait changer d'image. Voilà le onClick :
<a href="#" onClick="SwapImage('basket'); return false;">basket</a>

-> ça va remplacer l'image "sport-foot.png" par l'image "sport-basket.png".

IE ne fait absolument rien. Smiley fache
J'ai essayé, sous IE7 il y'avait une erreur. Si en JS tu fais GetElementByID il faut qu'il existe et la dans ton code il n'y a pas de ref sur 'myImage'.

Ton exemple ne fonctionne pas sur les autres browser!

As tu plus d'info ?
Ce petit bout de code fonctionne sous IE je sais pas si c'est cela que tu veux faire.
<a href="#" onClick="return SwapImage('basket'); return false">basket</a>
<a href="#" onClick="return SwapImage('helico'); return false">helico</a>
<img src="#" id="myImage" alt="sport">


Voila est ce que cela répond à ta question?
Kynerion a écrit :
Bonjour,

IE ne fait absolument rien. Smiley fache

Bonjour Kynerion et bienvenue sur ce forum.
Si tu as un doctype XHTML, les mots clés javascripts s'écrivent en minuscules : onclick, sinon je ne vois pas de raison pour que cela ne fonctionne pas.
Modifié par chmel (10 Aug 2007 - 00:19)
bonsoir ,

Si tu tiens à utiliser tout de même du javascript dans ce cas pour changer
d'image sur un clic tu peux passer par le DOM 0 et récupérer ta balise image
comme ceci (dom 0 permet un compatibilité pour tous les navigateurs )


<script type="text/ecmascript">
		  function main() {
		  	
		  	document.images['image'].setAttribute('src','/images/kzone.jpg');
			
			var i = document.images['image'];
			i.onclick = function() {this.setAttribute('src','/images/kzoneunknow.jpg')};
		  }
		  window.onload = main;
		</script>
	</head>
	<body>
	<img  id="image" alt="la tete a toto"/>
	</body>


pour obtenir ce résultat. Smiley lol
l'avantage est que la chaine de texte 'image' peut être générée dynamiquement et ne dépend pas de la position dans le document .

Il faut de toute façon éviter :

<a href="#" onClick="return SwapImage('basket'); return false">basket</a>
....

ton code javascript doit de trouver en dehors du document Html (au pire déclaré dans le header, mais pas mélangé aux balises Html)
Ce sont des éléments e en tant que tel on peut leur ajouter des attributs et propriétés depuis tes fonctions définies .
Modifié par kzone (08 Aug 2007 - 01:40)
Bonjour je rencontre un peu le meme souci que le créateur de ce post.

En gros j'ai cette fonction JS

function confirme(){
	return (confirm("Etes-vous sur de vouloir supprimer cet enregistrement ?"));
}


Appelé comme ceux ci
<a href="?var1=1&var2=2" onclick="return confirme();">cliquette ici</a>


Le but étant, comme vous l'aurez compris, d'ajouter une étape avant la suppression d'un enregistrement.

Naturellement ca fonctionne sous FF et bien évidemment pas sous IE Smiley biggrin !

Si vous trouvez mon erreur ou que vous avez une autre méthode je suis preneur !
Hello,

Je ne pense pas que ton problème soit lié à celui du créateur de ce sujet.

As-tu un exemple en ligne ou le code complet d'un exemple dans lequel tu rencontres ce problème ?
Bon bah autant pour moi Smiley rolleyes

En faisant un petit exemple en ligne pour vous exposer au mieux mon problème j'me suis rendu compte que l'erreur ne venait pas de ce petit bout de script !!! La vérité est ailleurs !!!

Voici quand même l'exemple en question pour les futurs lecteurs:

http://blo4r.free.fr/test-onclick.php

En fait mon vrai souci c'est que je suis vraiment perdu sans mon firebug sous ie :s
Modifié par bLo4r (04 Apr 2008 - 15:35)