OnClick -- Styles

**Woodgate** · 11/09/2006, 19h34

Bonjour,

J'ai un petit code qui est le suivant :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<font style='font-weight:bold;' onClick="this.style.fontWeight='normal'">Message de test</font>

Lorsque l'on clique sur ce <font>, on a donc un texte en gras qui devient normal (comprendre sans aucun style particulier).

Maintenant, je voudrais que ce principe puisse s'appliquer sur tout un <tr> (toute une ligne dans un tableau). Par exemple, j'ai ce code :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
...
<tr onclick=\"parent.window.messages.location='message.php?id=$id';\">
<td width='20' class='lignes'><img src='mess10.gif'></td>
<td width='93' class='lignes'><b>$login</b></td>
<td width='173' class='lignes'><b>$sujet</b></td>
<td class='lignes'><b>$date</b></td>
</tr>
...

Je voudrais que toute cette ligne soit en gras, et que lorsque l'on clique quelque part sur cette ligne (c'est le principe du onclick dans la balise <tr>), toute la ligne efface le style gras pour un style normal.

Merci de votre aide.

**lalouve** · 11/09/2006, 19h57

Hello

essaie

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
29
30
31
32
33
34
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 
<html>
<head>
	<title>Titre</title>
	<script type="text/javascript">
	function monClick(tr){
		parent.window.messages.location='message.php?id=$id';
 
		var tds = tr.getElementsByTagName("td");
		alert(tds.length);
		for(var i = tds.length-1; i>0; i--)
			{ tds[i].innerHTML = tds[i].innerHTML.substring(3, tds[i].innerHTML.length-4); }
	}
 
	</script>
</head>
 
<body>
<table border="1">
	<tbody>
		<tr onclick="monClick(this)">
		<td width='20' class='lignes'><img src='mess10.gif'></td>
		<td width='93' class='lignes'><b>$login</b></td>
		<td width='173' class='lignes'><b>$sujet</b></td>
		<td class='lignes'><b>$date</b></td>
		</tr>
	</tbody>
</table>
 
 
</body>
</html>

En remettant les antislashs aux bons endrois dans ton code

**Woodgate** · 11/09/2006, 20h01

Le souci, c'est que la fonction doit aussi avoir pour attribu le numero du lien ($id), pour déterminer où aller ensuite (parent.window.messages.location='message.php?id=$id'

.

**lalouve** · 11/09/2006, 20h11

ah oui exact.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
 
function monClick(tr, redirect){
		parent.window.messages.location='message.php?id='+redirect;
 
		var tds = tr.getElementsByTagName("td");
		alert(tds.length);
		for(var i = tds.length-1; i>0; i--)
			{ tds[i].innerHTML = tds[i].innerHTML.substring(3, tds[i].innerHTML.length-4); }
	}

et

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
<tr onclick=\"monClick(this,".$id.")\">

**Woodgate** · 11/09/2006, 20h31

Pourrais tu m'expliquer comment fonctionne ta fonction ?

Je ne comrpend pas trop en quoi elle pourrait faire devenir normal un texte en gras...

**lalouve** · 11/09/2006, 20h41

Elle récupère les td du tr sur lequel on a cliqué et elle enlève le <b> au début et le </b> à la fin de ce qui est à l'intérieur de chaque td (sauf pour le 1er td qui ne contient q'une image).

**Woodgate** · 11/09/2006, 21h13

Merci, ca fonctionne !

Juste une petite chose encore : comment faire pour que cette même fonction fasse disparaitre l'image de la première colonne ?

Merci.

OnClick -- Styles

JavaScript

Discussions similaires

Partager

Partager