11548 sujets

JavaScript, DOM et API Web HTML5

Compatibilité entre les navigateurs

Bonjour tout le monde,
J'ai un problème concernant la compatibilité entre les navigateurs,
j'ai créé un code permettant d'afficher ou non le contenu d'un tableau à partir d'un bouton. Mon code Java fonctionne (il passe pour IE, Opéra, ...) mais pas Firefox. Sauriez vous quelle partie du code n'est pas adaptée à Firefox? Ou connaitriez vous un site m'aidant pour l'adapter?

Le code est le suivant : 
function affiche() {
x=window.document.getElementById("art"+window.event.srcElement.id);
if (window.event.srcElement.tagName=="INPUT")
{
if (x.className=="vis"){x.className="invis";} else { x.className="vis";}

}
}


J'ai laissé le code qui ne tient pas compte des différents navigateur puisque celui-ci fonctionne, au contraire du code que j'ai essayé d'adapter.

J'ai vu que le problème pouvait venir du srcElement (à remplacer par target) mais je n'ai pas trouvé pour le reste du code.

Merci d'avance! Smiley cligne
Hello,

Petite précision : il s'agit de code JavaScript et non Java (c'est très différent). Smiley smile

Conformément aux spécifications, Firefox passe l'événement en paramètre à la fonction de gestion d'événement, contrairement à IE qui utilise la variable globale event. De la même façon, Firefox définit event.target plutôt que event.srcElement.
Merci pour la précision Julien.
As-tu une idée de ce que ça donnerait alors?
Tu as l'air de maitriser beaucoup mieux que moi le "Javascript" Smiley cligne et les problèmes de compatibilité.
En général, on écrit le code suivant :
function affiche(event) {
  event = event || window.event;
  [...]
}

En ce qui concerne les sources d'information au sujet des événements en JavaScript, je te conseille le tutoriel de Gilles Chagnon. De plus, il y aura dans une semaine ou deux un nouveau tutoriel à ce sujet sur Alsacréations. Smiley cligne
Merci pour le lien, notamment très utile par les exercices et corrections (exercices et corrections)

Par contre, j'ai réussi à adapter ce que je voulais en me basant sur un code fourni sur le site que tu m'as présenté mais toujours pas moyen de faire le code pour mon bouton! Je suis vraiment pas doué, ou trop tétu quand j'ai une idée en tête.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Document sans nom</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
.vis {
	display: inline;
}
.invis {
	display: none;
}
-->
</style>
</head>

<body>
<table width="100%" border="2" cellspacing="2" cellpadding="1" onClick="affiche()">
  <tr>
    <td width="12%"><input id="1" type="submit" name="Submit" value="Lire"></td>
    <td width="88%">Article 1</td>
  </tr>
  <tr>
    <td colspan="2" class="invis" id="art1">texte 1</td>
  </tr>
  <tr>
    <td><input id="2" type="submit" name="Submit" value="Lire"></td>
    <td>Article 2</td>
  </tr>
  <tr>
    <td colspan="2" class="invis" id="art2">texte 2</td>
  </tr>
  <tr>
    <td><input id="3" type="submit" name="Submit" value="Lire"></td>
    <td>Article 3</td>
  </tr>
  <tr>
    <td colspan="2" class="invis" id="art3">texte 3</td>
  </tr>
</table>
</body>

<script language="JavaScript" type="text/javascript">
var nom=navigator.appName;
function affiche(event) {
	event = event || window.event;
	if (nom=='Microsoft Internet Explorer') {
x=window.document.getElementById("art"+window.event.srcElement.id);
if (window.event.srcElement.tagName=="INPUT")
{
if (x.className=="vis"){x.className="invis";} else { x.className="vis";}
}}
else {
x=window.document.getElementById("art"+window.event.target.id);
if (window.event.target.tagName=="INPUT")
{
if (x.className=="vis"){x.className="invis";} else { x.className="vis";}
}
}

</script>


</html>
Sujet clos
Aller à