[DOM] pb execution innerHTML sous firefox

**durthu** · 17/09/2007, 17h54

Bonjour � tous,

Je suis actuellement en train de coder une page ou par d�faut on a un champ texte inactif, si on clique sur le bouton "modifier" cela active le champs texte et en plus cela fais apparaitre "valider" et "annuler" � la place du bouton "modifier".

Sous Internet explorer cela marche sans probl�me (IE7, je n'ai que �a sous la main), par contre quand j'essaye de l'executer sous Firefox, quand je clique sur le bouton "modifier" rien ne se passe. Cela fais maintenant une heure que je tourne et cherche l'erreur de syntaxe qu'il doit y avoir mais je ne trouve pas de r�ponse.

Si vous voulez bien me donner un coup de main, voici le code de la page en question.

CSS:

Code css :

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
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
img {
border: 0px;
}
 
a {
text-decoration: none;
color: black;
}
 
a.info 
{
position: relative;
text-decoration: none;
color: black;
}
 
a.info:hover
{
z-index:25; 
background: none;
}
 
a.info span
{
position: absolute;
left: -5000px;
}
 
a.info:hover span
{ 
display: block;
position: absolute;
top: 20px;
left: 20px;
width: 150px;
border: 2px solid red;
background: orange;
text-align: justify;
font-family: verdana;
font-size: 10px;
font-weight: bold;
color: white;
padding: 7px;
}
 
.validerModif{
position: relative;
display: inline;
}
 
a.choixElement span {
position: absolute;
left: -5000px;
}
 
a.choixElement:active span {
position: absolute;
left: 0px;
}

HTML:

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
 
<?xml version="1.0" encoding="iso-8859-1"?>
	<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<link rel="stylesheet" type="text/css" href="general.css" media="all" />
<script language='Javascript'>
function afficheBoutons(demande,adminConcerne) {
if (demande == 1){
alert("nom"+adminConcerne);
document.getElementById("nom"+adminConcerne).disabled=false;
document.getElementById("choixAdmin"+adminConcerne).innerHTML="<span><input type='submit' class='validerModif' name='valider' value='valider'> <input type='button' name='annuler' value='annuler' onClick='afficheBoutons(2,"+adminConcerne+")'>";
 
}
if (demande == 2){
document.getElementById("nom"+adminConcerne).disabled=true;
document.getElementById("choixAdmin"+adminConcerne).innerHTML="<input type='button' name='modifier' value='modifier' onClick='afficheBoutons(1,1)'>";
 
}
}
</script>
</head>
<body>
<p>Survolez le mot <a class="info" href="#"><span> vous avez ici plus d'informations sur l'aide que nous pouvons vous apporter </span><img src="aide.gif"/> </a></p>
<p><input type="text" name="nom1" value="user1" disabled /> <span id="choixAdmin1"><input type="button" name="modifier" value="modifier" onClick="afficheBoutons(1,1)"></span></p>
</body>

**denisC** · 17/09/2007, 20h44

Des inputs en dehors de form, c'est pas une bonne id�e (c'est m�me une erreur HTML).

Sinon, FFx prefere le DOM au innerHTML. Mais les deux devraient fonctionner.

**Bis�n�rs** · 17/09/2007, 20h52

Regarde ce topic, il peut t'aider :

http://developpez.net/forums/showthread.php?t=253088

**durthu** · 18/09/2007, 09h58

j'ai essay� de rajouter des balises <form> autour des <input> mais cela ne change rien.

pour ce qui est de l'utilisation de node, je ne comprends pas bien comme cela marche du coup je n'arrive pas � traduire mon code actuel en innerHTML en une version qui utiliserait les noeuds...

pour ce qui est du thread mis en lien, vous allez dire que je suis nul, mais je n'y comprend rien et je ne vois m�me pas le lien avec mon probl�me...

excusez ma mauvaise connaissance de javascript ...

**durthu** · 18/09/2007, 11h55

Finalement, j'ai repris le fichier en question depuis le d�but...

et l� cela marche, il s'agit donc s�rement d'une erreur de syntaxe dans le javascript...

au cas o� cela pourrait servir � certains d'entre vous je poste le code qui marche:

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
<?xml version="1.0" encoding="iso-8859-1"?>
	<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<SCRIPT language=javascript>
function go(adminConcerne){
document.getElementById("nom"+adminConcerne).disabled = false;
document.getElementById("modif"+adminConcerne).innerHTML = "<input type='button' name='valider' value='valider'></input><input type='button' name='annuler' value='annuler' onClick='annulation("+adminConcerne+")'></input>";
}
 
function annulation(adminConcerne){
document.getElementById("nom"+adminConcerne).disabled = true;
document.getElementById("modif"+adminConcerne).innerHTML = "<a href='#' onClick='go("+adminConcerne+")'>go</a>";
}
 
</SCRIPT>
</head>
<body>
 
<form>
<input type='text' name='element1' id='nom1' value='youpi' disabled></input>
<span id="modif1"><a href="#" onClick='go(1)'>go</a></span>
<br/><br/><input type='text' name='element2' id='nom2' value='youpi2' disabled></input>
<span id="modif2"><a href="#" onClick='go(2)'>go</a></span>
</form>
</body>
 
</html>

[DOM] pb execution innerHTML sous firefox

JavaScript

Vue hybride

Discussions similaires

Partager

Partager