Faire disparaitre et apparaitre du texte avec du javascript

Version imprimable

Bonjour à tous,
Voici mon gros soucis.
J'ai fait un petit script qui ne fonctionne pas comme je voudrais.
Le voila :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<table>
    <tr>
        <td>
            <script>
                function Affiche(Texte) {
                    if (Texte == '1') {
                        document.write('<table border="1"><tr><td>oui</td></tr></table>'); ;
                    }
                    else if (Texte == '2') {
                        document.write('<table border="1"><tr><td>non</td></tr></table>');
                    }
                    else {
                        document.write('<table border="1"><tr><td>peuetre</td></tr></table>');
                    }
                }
            </script>
        </td>
        <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
        <td><A href="javascript:;" onClick="Affiche('1');">1</A>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<A href="javascript:;" onClick="Affiche('2');">2</A></td>
    </tr>
 
 
</table>

Ce que je n'arrive pas à faire doit etre simple pour vous les experts :
en fait j'affiche le 1 et le 2
ils sont tout les deux cliquables.
Ils ont tout les deux un evement : Oui et Non
Mais je ne veux pas relancer la page , le 1 et le 2 doivent TOUJOURS rester en visuel et interactif : c'est à dire que je dois toujours pouvoir jouer sur le 1 et le 2 et avoir le oui et non.
C'est bizarre non que ma page efface tout.
Merci de votre aide.

30/03/2011, 19h27
NoSmoking

Citation:

Envoyé par edophie

C'est bizarre non que ma page efface tout.

NON document.write efface TOUT le contenu de la page une fois celle ci écrite.

On peux utiliser document.write à la création de la page, avec parcimonie, ou seul d'ailleurs, mais JAMAIS une fois celle ci chargée sous peine de ce qui t'arrives.
30/03/2011, 19h33
edophie

Merci pour l info
Mais please que dois je faire car je ne suis qu un bleu en dev
Merci beaucoup

Voilà j'ai trouvé la réponse
Voici la solution :

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
76
77
78
79
80
81
<script>
 
var texte_numero1;
var texte_numero2;
 
if (document.layers) {texte_numero1 = "nn4"}
if (document.all) {texte_numero1 = "ie"}
if (window.navigator.userAgent.toLowerCase().match("chm")) {
   texte_numero1= "chm"
}
 
if (document.layers) { texte_numero2 = "nn4" }
if (document.all) { texte_numero2 = "ie" }
if (window.navigator.userAgent.toLowerCase().match("chm2")) {
    texte_numero2 = "chm2"
}
 
 
function show1() {
    if (texte_numero1 == "chm")
        document.poppedLayer =
         eval('document.getElementById("texte1")');
    else if (texte_numero1 == "ie")
        document.poppedLayer =
        eval('document.getElementById("texte1")');
    else
        document.poppedLayer =
         eval('document.layers["texte1"]');
    document.poppedLayer.style.visibility = "visible";
 
    if (texte_numero2 == "chm2")
        document.poppedLayer =
         eval('document.getElementById("texte2")');
    else if (texte_numero2 == "ie")
        document.poppedLayer =
        eval('document.getElementById("texte2")');
    else
        document.poppedLayer =
         eval('document.layers["texte2"]');
    document.poppedLayer.style.visibility = "hidden";
}
 
function show2() {
    if (texte_numero1 == "chm")
        document.poppedLayer =
         eval('document.getElementById("texte1")');
    else if (texte_numero1 == "ie")
        document.poppedLayer =
        eval('document.getElementById("texte1")');
    else
        document.poppedLayer =
         eval('document.layers["texte1"]');
    document.poppedLayer.style.visibility = "hidden";
 
    if (texte_numero2 == "chm2")
        document.poppedLayer =
         eval('document.getElementById("texte2")');
    else if (texte_numero2 == "ie")
        document.poppedLayer =
        eval('document.getElementById("texte2")');
    else
        document.poppedLayer =
         eval('document.layers["texte2"]');
    document.poppedLayer.style.visibility = "visible";
}
 
</script>
 
<form>
 
<input type=button onClick="show1()" value="show1">
<input type=button onClick="show2()" value="show2">
 
</form>
<div id="texte1"  style="visibility: visible">
<big>Texte1</big>
<layer></layer></div>
 
<div id="texte2"  style="visibility: hidden">
<big>Texte2</big>
<layer></layer></div>

30/03/2011, 21h32
Auteur

bonsoir,

supprime eval() c'est complètement inutile dans ton cas.

A ma connaissance les balises <layer> ne sont plus utilisées depuis que Netscape a disparu.
Et poppedLayer c'est quoi ? :koi:
30/03/2011, 22h09
NoSmoking

document.getElementById( nom_element) est de nos jours bien suffisant et crossbrowser, pas la peine dans faire plus.

Code:

<script>

doit ce mettre

Code:

<script type="text/javascript">

tu as 2 fonctions show1 et show2 que tu peux sans mal factoriser, peux de différente sachant que l'on peut passer des paramètres aux fonctions.

Citation:

Envoyé par Auteur

Et poppedLayer c'est quoi ?

juste une variable crée.