[HTML] problème : innerHTML (bizarre)

**programaniac** · 06/04/2008, 00h23

Bonsoir les gars,

voilà voilà mon problème

j'ai voulu m'amuser avec de l'ajax hihi et je m'en suis mit plein les yeux bah quel idiot de l'ajax dans les yeux c'est mauvais parce que c'est du javel on ne met pas je javel dans les yeux mais dans l'eau

hoo c'est on a compris la feinte lol

plus sérieusement

en modifiant le contenu d'une balise P qui contient un formulaire avec la propriété "innerHTML",voilà que le formulaire ne s'en retrouve pas du tout effacé mais que le texte y est ajouter.
alors que quand je fait la meme chose avec une balise div le contenu de la balise div elle est bien vidé du formulaire et remplacer par le texte

est ce que quelqu'un pourrait m'expliquer ce phénomène pour moins spécial et si il y a d'autre truc dans le genre j'aimerai avoir de plus amples informations

mais un exemple est plus parlant il vous suffit de copier coller ce bout de code dans un nouveau fichier vide et vous verrez le resultat

MERCI d'avance

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
 
<html>
<head>
<script type="text/javascript">
function changeForm()
{
        document.getElementById('Form1').innerHTML="Ici le formulaire change";
        document.getElementById('Form2').innerHTML="Ici le formulaire change PAS!!!";
}
</script>
</head>
<body>
 
<div id="Form1">
		<form>
	<input type="button" value="Formulaire 1" />
		</form>
</div>
 
<p id="Form2">
		<form>
			<input type="button" value="Formulaire 2" />
		</form>
</p>
<input type="button" onClick="changeForm()">
</body>
</html>

Bonne soirée à tous

**hellspawn_ludo** · 06/04/2008, 12h24

Bonjour programaniac,

Je viens de tester ton code et le innerHTML a bel et bien effacé les 2 formulaires. Je vois donc les 2 phrases de la fonction.

Alors, où est le hic ??

**Auteur** · 06/04/2008, 12h41

Envoyé par hellspawn_ludo

Bonjour programaniac,

Je viens de tester ton code et le innerHTML a bel et bien effacé les 2 formulaires. Je vois donc les 2 phrases de la fonction.

Alors, où est le hic ??

pas chez moi... Avec FF2, le contenu du paragraphe 2 (Form2) s'ajoute bien au contenu déjà présent.

**Auteur** · 06/04/2008, 13h04

j'ai compris pourquoi. Pour cela mets une bordure sur ton P et regarde l'arborescence de ta page en utilisant l'inspecteur DOM de FF.

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
 
 
<html>
<head>
<script type="text/javascript">
function changeForm()
{
        document.getElementById('Form1').innerHTML="Ici le formulaire change";
        document.getElementById('Form2').innerHTML="Ici le formulaire change PAS!!!";
}
</script>
</head>
<body>
 
<div id="Form1">
		<form>
			<input type="button" value="Formulaire 1" />
		</form>
</div>
 
<p id="Form2" style="border: 1px #000000 solid">
		contenu de P
		<form>
			<input type="button" value="Formulaire 2" />
		</form>
 
</p>
<input type="button" onClick="changeForm()">
</body>
</html>

Le form contenu dans p n'est pas encadré par la bordure noire. Seul le texte ("contenu de P") est encadré. En regardant l'arborescence de ta page, on constate que le second form n'est pas dans le p !!.

Ce qui explique que document.getElementById('Form2').innerHTML="Ici le formulaire change PAS!!!"; "ajoute" le texte sans remplacer le formulaire.

p ne peut pas contenir de balises de type block (p, form, div, table...).

**hellspawn_ludo** · 06/04/2008, 14h54

Auteur,

Au temps pour moi. Je n'avais pas essayé avec FF.

C'est tout de même chiant cette espèce de non compatibilité.

**FremyCompany** · 06/04/2008, 17h58

Essaie de mettre un <SPAN><DIV> avant ta FORM + refermer les balises à la fin

C'est tout aussi illégal mais peut-être que cela passera mieux (car le SPAN peut être dans le P, et que même si on peut théoriquement pas mettre de DIV dans un SPAN, ca a toujours marché, et qu'on peut bien évidemment mettre un FORM dans un DIV

Mais je n'ai pas testé.
Tiens moi au courrant si ca marche ou pas.

[HTML] problème : innerHTML (bizarre)

HTML

Vue hybride

Discussions similaires

Partager

Partager