Deplacement de titre dans une table HTML
Bonjour,j'ai un petit souci pour l'ordre de function.
L'objective est d'un simple click suffisant pour dépalcer la titre de la table de haut en bas. Le script fonctionne bien,mais le problème c'est que le résultat ne dure qu'un seconde:?
titre.html
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 HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title >Dépalcement de titre</title>
<script type="text/javascript" src="titre.js"></script>
</head>
<body>
<form>
<table id="t1" border="1">
<tr>
<th>titre1</th>
<th>titre2</th>
</tr>
<tr>
<td>L1C1</td>
<td>L1C2</td>
</tr>
<tr>
<td>L2C1</td>
<td>L2C2</td>
</tr>
<tr>
<td>L3C1</td>
<td>L3C2</td>
</tr>
<tr>
<td>L4C1</td>
<td>L4C2</td>
</tr>
<tr>
<td>L5C1</td>
<td>L5C2</td>
</tr>
</table>
<input type="submit" value="Déplacer" >
</form>
</body>
</html> |
titre.js
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
|
function soumettre() {
var table = document.getElementsByTagName("tr");
var titre = document.getElementsByTagName("th");
var newTitre = table[0].cloneNode(true);
table[0].parentNode.removeChild(table[0]);
table[0].parentNode.appendChild(newTitre);
}
window.onload = function() {
document.forms[0].onsubmit = soumettre;
}
/*window.onload = function() {
var table = document.getElementsByTagName("tr");
var titre = document.getElementsByTagName("th");
var newTitre = table[0].cloneNode(true);
table[0].parentNode.removeChild(table[0]);
table[0].parentNode.appendChild(newTitre);
}*/ |
