script qui boucle sous Fx3 et pas sous ie6

Version imprimable

Bonsoir,

voici un petit script de test (Edit : cf. test simplifié post suivant) qui fonctionne sous ie6 mais qui boucle sous Fx3 : quand je clique sur TEST je vois le résultat apparaître et la page se réinitialise aussitôt :

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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Untitled Page</title>
</head>
<body>
 
    <script type="text/javascript">
        var fileMessages = [];
 
        function ajouteMessage(txtMsg, criticiteMsg) {
            Msg = {
                texte: txtMsg,
                criticite: criticiteMsg
            };
            fileMessages.push(Msg);
        }
 
        function test() {
 
            ajouteMessage('message 1', 'info');
            ajouteMessage('message 2', 'avert');
 
            for (i in fileMessages) {
                document.write(fileMessages[i].texte);
                document.write(' : ');
                document.writeln(fileMessages[i].criticite);
                document.writeln('<br>');
            }
	}
    </script>
 
    <a href="#" onclick="test();">+++ TEST +++</a>
</body>
</html>

24/02/2009, 22h32
_Mac_

Aucune idée du problème, c'est plutôt étrange. Mais si tu ajoutes un return false à ta fonction test() et que tu fais onclick="return test();", la page n'est plus rarfraîchie mais FF semble pédaler dans le vide :roll:

Même en simplifiant à mort y'a toujours le problème :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<html>
<head>
    <title>Untitled Page</title>
</head>
<body>
 
    <script type="text/javascript">
        var fileMessages = [];
 
        function test() {
			fileMessages.push('message');
            document.write(fileMessages[0]);
		}
    </script>
 
    <a href="#" onclick="test();">+++ TEST +++</a>
</body>
</html>

Et si tu ajoutes document.close(); après ta boucle ?

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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Untitled Page</title>
</head>
<body>
 
    <script type="text/javascript">
        var fileMessages = [];
 
        function ajouteMessage(txtMsg, criticiteMsg) {
            Msg = {
                texte: txtMsg,
                criticite: criticiteMsg
            };
            fileMessages.push(Msg);
        }
 
        function test() {
 
            ajouteMessage('message 1', 'info');
            ajouteMessage('message 2', 'avert');
			
            for (i in fileMessages) {
                document.write(fileMessages[i].texte);
                document.write(' : ');
                document.writeln(fileMessages[i].criticite);
                document.writeln('<br>');
            }
			document.close();
	}
    </script>
 
    <a href="javascript:void(0);" onclick="test();">+++ TEST +++</a>
</body>
</html>

Bonne soirée à toi !

25/02/2009, 09h04
Peanut

Non, ça ne change rien. :|

J'ai trouvé pourquoi :-)

=> le document.write !

celui ci écrase le lien, étant donnée que le onclick est effectué avant le href, MAIS que celui ci est dans la file d'attente des thread, après l'effacement du lien par le document.write , le navigateur attend un retour et tourne en boucle ...

exemple pour contourner le problème :

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
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Untitled Page</title>
</head>
<body>
 
    <script type="text/javascript">
        var fileMessages = [];
 
        function ajouteMessage(txtMsg, criticiteMsg) {
            Msg = {
                texte: txtMsg,
                criticite: criticiteMsg
            };
            fileMessages.push(Msg);
        }
 
        function test() {
 
            ajouteMessage('message 1', 'info');
            ajouteMessage('message 2', 'avert');
 
            for (i in fileMessages) {
                document.getElementById('toto').innerHTML+= (fileMessages[i].texte);
               	document.getElementById('toto').innerHTML +=(' : ');
                document.getElementById('toto').innerHTML +=(fileMessages[i].criticite);
                document.getElementById('toto').innerHTML +=('<br>');
            }
			return false;
		}
    </script>
 
    <a href="#" onclick="return test();">+++ TEST +++</a>
	<div id="toto">
 
	</div>
</body>
</html>

25/02/2009, 09h43
Peanut

:king:
Merci et bravo, j'aurais pu chercher longtemps !