Petit script dans html - non valid� W3C

**mariaorea** · 15/08/2014, 11h35

Bonjour,
Je suis webdesigner et j'utilise dans un de mes site un petit script qui m'a �t� donn� par un d�veloppeur. Cela fonctionne super bien mais malheureusement il ne passe pas la validation W3C : message : "Attribute value not allowed on element a at this point", c'est un peu g�nant.
Je ne connais pas assez le javascript pour pouvoir le changer. Quelqu'un pourrait-il m'aider ?
Merci infiniment par avance.

Lien du site o� je l'utilise :
http://www.sodecinternational.fr/page.php

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8" />
<title>essais</title>
</head>
 
<body>
            <a value="0" onmouseover="showC(this.getAttribute('value'));">Lien 1</a>
            <a value="1" onmouseover="showC(this.getAttribute('value'));">Lien 2</a>
            <a value="2" onmouseover="showC(this.getAttribute('value'));">Lien 3</a>
            <a value="3" onmouseover="showC(this.getAttribute('value'));">Lien 4</a>
            <a value="4" onmouseover="showC(this.getAttribute('value'));">Lien 5</a>
 
<div style="display:block;" id="c0">Mon contenu 1</div>
<div style="display:none;" id="c1">Mon contenu 2</div>
<div style="display:none;" id="c2">Mon contenu 3</div>
<div style="display:none;" id="c3">Mon contenu 4</div>
<div style="display:none;" id="c4">Mon contenu 5</div>
 
<script type="text/javascript">
            function showC(value){
 
                    for(var x = 0;x<5;x++){
                    var idc = document.getElementById("c" + x);
                    idc.style.display = 'none';
                    }
 
                    var idl = document.getElementById("c" + value);
                    idl.style.display = 'block';
             }
</script>
</body>
</html>

**sekaijin** · 15/08/2014, 14h41

j'avoue ne pas comprendre pourquoi tu mets une value � un lien pour en dur dans le code la r�cup�rer

Code html :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
<a onmouseover="showC('0');">Lien 1</a>
<a onmouseover="showC('1');">Lien 2</a>
<a onmouseover="showC('2');">Lien 3</a>
<a onmouseover="showC('3');">Lien 4</a>
<a onmouseover="showC('4');">Lien 5</a>

sinon pour ajouter ses propres attributs et faire une validation W3C il faut utiliser un namespace.

Code HTML :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
<a perso:value="0" onmouseover="showC(this.getAttribute('urn:com.mycompagny.perso', 'value'));" 
 xmlns:perso="urn:com.mycompagny.perso">Lien 1</a>

ainsi l'attribut value n'est pas d�fini dans l'espace de nom HTML mais dans l'espace urn:com.mycompagny.perso le validateur W3C v�rifie que les attribut d'un tag html sont possible pour le TAG pour cela il se base sur la d�finition du sch�ma html xhtml1-strict.xsd lorsqu'il va rencontrer le tag value avec le pr�fixe perso il va se r�f�rer au sch�ma associ� � urn:com.mycompagny.perso
pour que �a fonction il faut que tu fournisse au validateur le sch�ma. pour se faire il faut non seulement �crire le sch�ma (pas toujours simple) et aussi indique o� le trouver (les validateur en ligne demande � ce qu'il soit sur internet)

Code HTML :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
<a perso:value="0" onmouseover="showC(this.getAttribute('urn:com.mycompagny.perso', 'value'));" 
 xmlns:perso="urn:com.mycompagny.perso" 
 xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
 xsi:schemaLocation="urn:com.mycompagny.perso http://www.mycompagny.com/perso_namespace.xsd">Lien 1</a>

Comme tu le vois un simple attribut devient compliqu� � ajouter pour rester dans les r�gles.
Je te conseille donc de ne pas utiliser l'attributs suppl�mentaires.
de plus j'utiliserais les id (et non pas un num�ro pour reconstruire l'id ensuite)

Code HTML :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8" />
<title>essais</title>
</head>
 
<body>
<a onmouseover="showC('c0');">Lien 1</a>
<a onmouseover="showC('c1');">Lien 2</a>
<a onmouseover="showC('c2');">Lien 3</a>
<a onmouseover="showC('c3');">Lien 4</a>
<a onmouseover="showC('c4');">Lien 5</a> 
<div style="display:block;" id="c0">Mon contenu 1</div>
<div style="display:none;" id="c1">Mon contenu 2</div>
<div style="display:none;" id="c2">Mon contenu 3</div>
<div style="display:none;" id="c3">Mon contenu 4</div>
<div style="display:none;" id="c4">Mon contenu 5</div>
 
<script type="text/javascript">
 function showC(id){
  for(var x = 4;x>=0;x--){
   var idc = document.getElementById("c" + x);
   idc.style.display = 'none';
  }
 
  var idl = document.getElementById(id);
  idl.style.display = 'block';
 }
</script>
</body>
</html>

A+JYT

**mariaorea** · 15/08/2014, 15h21

merci beaucoup pour ta prompte r�ponse.
C'est un peu trop compliqu� pour moi, cela d�passe mes comp�tences.
Comme je disais dans mon post, ce code m'a �t� donn� par un d�veloppeur pour m'aider. Il fonctionne tellement bien que je ne voulais pas trop le changer. J'ai essay� avec des ancres et �a ne marchait pas.
As-tu une id�e de comment je pourrais faire de fa�on tr�s simple avec un petit script, tout en gardant la configuration actuelle de mon code ?

je te redonne le lien du site

http://www.sodecinternational.fr/page.php