Attention aux balises utilisées et à la syntaxe.
<a href=index.php onclick="myFunction(obj)"> Moi </div>
- Une balise <a> doit avoir sa fermante associée </a> ! C'est valable pour toutes les balises fermantes.
- Idem en Javascript. Je vois, par exemple, deux accolades } fermantes. Une seule suffit
- Ne pas confondre valeur d'une variable et nom d'une variable. Je vois qu'il y a confusion. Dans l'exemple ci - dessus, obj semble être l'id de la div qui contient les liens à cacher/afficher. Ce n'est pas le nom d'une variable !! Il ne faut pas le passer tel quel en paramètre de la fonction.
- Les commentaires en HTML s'écrivent ainsi : <!-- Mon commentaire HTML -->.
A ne pas confondre avec javascript : // Mon commentaire Javascript sur une ligne
1
2
3
| /*
Mon commentaire Javascript sur plusieurs lignes
*/ |
- Attention au nommage des variables, également. obj n'est pas du tout adapté, vu qu'il s'agit d'un "id". Appeler un chat un chat, et la future lecture de ce code n'en sera que plus simple.
Un peu plus de rigueur donc et il y aura moins de problème quant au bon fonctionnement.
Voici un exemple d'une page complète permettant d'afficher/cacher une div au click sur un lien (à copier/coller dans un fichier nu, à lancer avec le navigateur préféré, analyser le code et le comprendre. Enfin poser les questions si jamais il y en a 
) :
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
35
36
37
| <!DOCTYPE html>
<html>
<head>
<title>Afficher/Cacher une div au click sur un lien</title>
<style>
/* Ceci veut dire que l'élément HTML ayant pour id "liens" sera caché au chargement de la page */
#liens{
display: none;
}
</style>
<script>
/*
* Ceci est une fonction qui permet de cacher ou afficher un élément
*/
function basculerAffichage(id) {
var el = document.getElementById(id);
if(el.style.display != "block")
el.style.display="block";
else
el.style.display="none";
}
</script>
</head>
<body>
<h1>Afficher/Cacher une div au click sur un lien</h1>
<!-- Le lien qui permet d'afficher/cacher. Le href ne sert à rien ici -->
<a href="#" onclick="basculerAffichage('liens')"> Afficher/Cacher les liens </a>
<!-- La div qui contient les liens. Elle s'appelle donc "liens". Le style associé (voir le CSS ci dessus, permet de cacher la div au lancement de la page -->
<div id="liens">
<ul>
<li><a href="index.php" > Moi </a></li>
<li><a href="pop.php"> Pop </a></li>
</ul>
</div>
</body>
</html> |
Menu Sous menu
Répondre avec citation
:
Partager