Affichage d'un texte dans un document.

Version imprimable

Voila mon problème :

Je voudrais que lorsque quelqu'un clique sur un lien que cela fasse apparaître un texte juste en dessous et que lorsque qu'il reclique celui ci disparraise.

voila ce que j'ai tenter :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 <html> <head> <script language="JavaScript"> function afficher(form1){ document.write("testseset"); } </script> </head> <body> <h3> Note de Synthèse : Inventaire/Gestion de Parc </h3> <form name="form1"> <p><input type="button" value="Envoyer" onClick="afficher(form1)" > <a href='#' onClick="afficher(form1)">test</a></p> </form> <body> </html>
Est-ce que quelqu'un aurait une idée ?

24/03/2007, 11h54
Bisûnûrs

A quoi te sert ton paramètre form1 dans l'appel de ta fonction ?

Sinon tu peux t'inspirer de ça :
http://javascript.developpez.com/faq...Objs#TextCheck

le paramettre form1 c'est juste pour lui indiquez ce qu'il doit afficher

par exemple une truc du style :
Code:

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 <html> <head> <script language="JavaScript"> function afficher(nom){ if(nom==glpi) { document.write("texte sur glpi"); } if(nom==isa) { document.write("Texte sur isa"); } if(nom==apache) { document.write("Le projet apache..."); } } </script> </head> <body> <h3> Note de Synthèse : Inventaire/Gestion de Parc </h3> <p><a href='#' onClick="afficher(glpi)">test</a></p> <p><a href='#' onClick="afficher(isa)">test</a></p> <p><a href='#' onClick="afficher(apache)">test</a></p> </form> <body> </html>
J'ai vu la solution que tu ma proposer et j'y avais penser mais j'aimerait ne pas utiliser de formulaire. Le JavaScript ne permet pas d'inserer du texte dans un document ??? pourtant je les déjà vu sur d'autre site

Je ne t'ai pas dit de passer par un formulaire, mais de t'en inspirer.

Il faut éviter également d'utiliser document.write.

Enfin, tu ne mets pas les quotes à l'appel de ta fonction, ni dans le code de ta fonction, pourtant c'est bien du texte.

Code:

onClick="afficher('glpi')"

Tu peux dans ce cas utiliser le DOM ou une bête fonction Javascript.
Code:

1 2 <div id="textDyn"></div> <a href="javascript:;" onclick="afficher('texte')">Blabla</a>
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 /* fonction innerHTML */ function afficher(texte){ if(nom == texte){ document.getElementById('textDyn').innerHTML = 'Ton nouveau texte'; } ... } /* DOM */ function afficher(texte){ if(nom == texte){ document.getElementById('textDyn').appendChild(document.createTextNode('Ton nouveau texte')); } ... }
Tu peux aussi, pour un meilleur référencement de ton texte, l'écrire dans des balises que tu masques/affiches selon le lien cliqué :
Code:

1 2 3 4 5 6 <div id="texte1" style="display:none">Texte 1</div> <div id="texte2" style="display:none">Texte 2</div> <div id="texte3" style="display:none">Texte 3</div> <a href="javascript:;" onclick="afficher(document.getElementById('texte1')">Blabla1</a> <a href="javascript:;" onclick="afficher(document.getElementById('texte2')">Blabla2</a> <a href="javascript:;" onclick="afficher(document.getElementById('texte3')">Blabla3</a>
Code:

1 2 3 4 5 6 function afficher(obj){ for(var i = 1; i <= 3; i++){ document.getElementById('texte' + i).style.display = 'none'; } obj.style.display = 'block'; }

Merci bcp pour ton aide voilà la solution retenu que j'ai retenu qui me paraît très pratique :

Code:

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
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
<?session_start();?>
<html>
<head>
<title>"Luffys IG Concept : PTI/Projet"</title>
	<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-15" />
	<meta http-equiv="Content-Style-Type" content="text/css" />
	<meta http-equiv="Content-Language" content="fr" />
 
<link rel="stylesheet" type="text/css" href="design.css">
 
<script language="JavaScript">
 
function afficher(nom){
 
// Masque tous les div text1 a 3
 for(var i = 1; i <= 3; i++){
      document.getElementById('text' + i).style.display = 'none';
  }
 
 
   obj=document.getElementById(nom);
 
// affichage du text cliquer
   if(obj.style.display=='none'){
   obj.style.display ='block';
   }
// Masquage tu text cliquer
   else{
   obj.style.display ='none';
   }
 
 
}
 
</script>
 
</head>
 
<div id="conteneur">
		<h1 id="header">
		<?
		$site='pti';
		include('login.php');
		include('annonce.php');?>
		</h1>
		<?
		include('menu.php');
		?>
 
<?
//VERIFICATION DE L'AUTHENTIFICATION DE L'UTILISATEUR
		$auth=true;
		if((!isset($_SESSION['login']))||(empty($_SESSION['login'])))
		{
		$auth=false;
		}
 
?>
		<div id="contenu">
 
		<!-- NOTE DE SINTHESE-->
		<h3> Note de Synthèse : Inventaire/Gestion de Parc </h3> 
 
 
	<a href="javascript:" onClick="afficher('text1')"> Cliquer ici</a></p>
	<div id="text1" style="display:none;">Mon texte a afficher</div>
 
 
 
		</div>
<p id="footer">Réalisation des codes xhtml & css et du design par Guilleret Florian</p>
</div>
 
<body>
</html>

Merci encore

24/03/2007, 14h13
Bisûnûrs
Ton test :
Code:

1 2 3 4 5 6 7 8 // affichage du text cliquer if(obj.style.display=='none'){ obj.style.display ='block'; } // Masquage tu text cliquer else{ obj.style.display ='none'; }
est inutile, dans tous les cas il passera dans le if, vu que juste avant tu fais une boucle pour les passer tous à none.

Mon code était suffisant.

erf j'ai oublier de modifier.

Ta technique ne me convenait pas vu que je voulais :

- on click sa affiche le div
- on reclick sa l'enlève
- ceci sans masquer les autres div
- Ce n'était pas très souple si l'on veut rajouter un div il faut modifier le for...
- Et puis les text1,2,3 ce n'est pas très pratique et explicite

donc j'ai fait :
Code:

1 2 3 4 5 6 7 8 9 10 11 function afficher(nom){ obj=document.getElementById(nom); // affichage du text cliquer if(obj.style.display=='none'){ obj.style.display ='block'; } // Masquage tu text cliquer else{ obj.style.display ='none'; }