execution de code en diff�r�
Bonjour,
J'ai un petit souci pas �vident � formuler.
Il s'agit d'ex�cuter du code apr�s le chargement d'une page web, et lorsque le code s'ex�cute apr�s et est assez long, il ne faudrait pas qu'il bloque l'utilisateur, qu'il soit en arri�re plan en quelque sorte.
J'ai r�duit mon probl�me � 3 tableaux � remplir.
Le premier se remplit au chargement de la page, et les deux autres (qui seraient cach�s dans mon probl�me) se rempliraient id�alement apr�s le chargement mais sans bloquer l'utilisateur qui doit pouvoir manipuler le premier tableau (ascenseur du div le contenant pour en examiner le contenu par exemple) sans �tre bloqu� durant le chargement des deux autres.
Je ne sais pas si c'est clair mais voil� le code -certes peu rigoureux - :
Dans ce code, je charge en body.onload le premier tableau, j'attends 5 secondes pendant lesquelles je peux manipuler l'ascenseur du premier tableau, puis les deux autres se chargent mais -a�e- �a bloque alors la manipulation du premier.
Si vous pouviez �clairer ma lanterne... :)
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
|
<html>
<head>
<script language="javascript" type="text/javascript" >
//////////////////////////////
function reste()
//////////////////////////////
{
oTab = document.getElementById("tab2");
for(var i=0;i<600;i++)
{
oRow=oTab.insertRow();
oCell=oRow.insertCell();
oCell.innerHTML="<table><tr><td>2</td></tr></table><table><tr><td>2</td></tr></table><table><tr><td>2</td></tr></table>";
oCell=oRow.insertCell();
oCell.innerHTML="<table><tr><td>2</td></tr></table><table><tr><td>2</td></tr></table><table><tr><td>2</td></tr></table>";
oCell=oRow.insertCell();
oCell.innerHTML="<table><tr><td>2</td></tr></table><table><tr><td>2</td></tr></table><table><tr><td>2</td></tr></table>";
oCell=oRow.insertCell();
oCell.innerHTML="<table><tr><td>2</td></tr></table><table><tr><td>2</td></tr></table><table><tr><td>2</td></tr></table>";
oCell=oRow.insertCell();
oCell.innerHTML="<table><tr><td>2</td></tr></table><table><tr><td>2</td></tr></table><table><tr><td>2</td></tr></table>";
}
oTab = document.getElementById("tab3");
for(var i=0;i<600;i++)
{
oRow=oTab.insertRow();
oCell=oRow.insertCell();
oCell.innerHTML="<table><tr><td>3</td></tr></table><table><tr><td>3</td></tr></table><table><tr><td>3</td></tr></table>";
oCell=oRow.insertCell();
oCell.innerHTML="<table><tr><td>3</td></tr></table><table><tr><td>3</td></tr></table><table><tr><td>3</td></tr></table>";
oCell=oRow.insertCell();
oCell.innerHTML="<table><tr><td>3</td></tr></table><table><tr><td>3</td></tr></table><table><tr><td>3</td></tr></table>";
oCell=oRow.insertCell();
oCell.innerHTML="<table><tr><td>3</td></tr></table><table><tr><td>3</td></tr></table><table><tr><td>3</td></tr></table>";
oCell=oRow.insertCell();
oCell.innerHTML="<table><tr><td>3</td></tr></table><table><tr><td>3</td></tr></table><table><tr><td>3</td></tr></table>";
}
};
//////////////////////////////
function init()
//////////////////////////////
{
oTab = document.getElementById("tab1");
for(var i=0;i<600;i++)
{
oRow=oTab.insertRow();
oCell=oRow.insertCell();
oCell.innerHTML="<table><tr><td>1</td></tr></table><table><tr><td>1</td></tr></table><table><tr><td>1</td></tr></table>";
oCell=oRow.insertCell();
oCell.innerHTML="<table><tr><td>1</td></tr></table><table><tr><td>1</td></tr></table><table><tr><td>1</td></tr></table>";
oCell=oRow.insertCell();
oCell.innerHTML="<table><tr><td>1</td></tr></table><table><tr><td>1</td></tr></table><table><tr><td>1</td></tr></table>";
oCell=oRow.insertCell();
oCell.innerHTML="<table><tr><td>1</td></tr></table><table><tr><td>1</td></tr></table><table><tr><td>1</td></tr></table>";
oCell=oRow.insertCell();
oCell.innerHTML="<table><tr><td>1</td></tr></table><table><tr><td>1</td></tr></table><table><tr><td>1</td></tr></table>";
}
setTimeout("reste()",5000);
};
</script>
</head>
<body onload="init()">
<div style="height:300px;overflow:scroll"><table border="1" id="tab1"></table></div>
<div style="height:300px;overflow:scroll;"><table border="1" id="tab2"></table></div>
<div style="height:300px;overflow:scroll;"><table border="1" id="tab3"></table></div>
</body>
</html> |
