Salut,

J'utilise un select multiple comme ci-dessous :

<select name="sel" id="sel" size="6" multiple="multiple">
    <option value="opt">Opt</option>
    [... autres options... ]
</select>

Si je veux choisir plusieurs éléments, je dois maintenir la touche CTRL et cliquer sur les éléments qui m'intéressent.

Ce que je cherche à faire, c'est de me passer de l'utilisation de CTRL : il faudrait que lorsque je clique sur un élément, ça le sélectionne sans désélectionner les autres, et si je clique sur un élément déjà sélectionné il faudrait qu'il se désélectionne.

Je n'ai pas trouvé comment faire ça avec les propriétés XHTML/CSS, je ne pense pas que ce soit possible.
Il va donc certainement me falloir du Javascript, mais je ne vois pas trop comment faire.

Si vous avez des suggestions ou même des exemples, ça m'intéresse.

Merci !

Salut,
j'ai l'habitude de travailler avec jQuery, donc l'exemple que je te propose en tire partie. Rien ne t'empêche de transformer tout ça pour ne pas avoir à l'utiliser.
Essaye déjà ce petit script, et regarde si cela peut te convenir.

<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.js"></script>
<script type="text/javascript">
$(document).ready(function () {
 $("#sel option").mousedown(function () {
  if ($(this).attr('selected') === false)
  {
   $(this).attr('selected', 'selected');
   return false;
  }
  else
  {
   $(this).removeAttr('selected');
   return false;
  }
 });
});
</script>

Merci pour ta réponse

Voici la solution que j'ai finalement retenue, pour sa clarté vis à vis de l'utilisateur, pour sa légèreté, et pour sa simplicité de mise en place :

div.scrollable_checkboxes {
	height: 100px;
	overflow: auto;
	border: 1px solid #FFBC00;
}

<div class="scrollable_checkboxes">
	<input type="checkbox" name="cb[]" value="1" id="cb1"/>
	<label for="cb1">Checkbox 1</label>
	<br />
	<input type="checkbox" name="cb[]" value="2" id="cb2"/>
	<label for="cb2">Checkbox 2</label>
	<br />
	<input type="checkbox" name="cb[]" value="3" id="cb3"/>
	<label for="cb3">Checkbox 3</label>
	<br />
	<input type="checkbox" name="cb[]" value="4" id="cb4"/>
	<label for="cb4">Checkbox 4</label>
	<br />
	<input type="checkbox" name="cb[]" value="5" id="cb5"/>
	<label for="cb5">Checkbox 5</label>
	<br />
	<input type="checkbox" name="cb[]" value="6" id="cb6"/>
	<label for="cb6">Checkbox 6</label>
</div>

Cette solution ne fait finalement pas appel à du Javascript.

EDIT : petite correction, merci Passant.

Ah ben oui, c'est très élégant comme solution, bon choix en effet.
Tel quel, tu vas avoir un problème au niveau du "name" par contre, il te faudra utiliser "cb[]" pour récupérer plusieurs valeurs.
Bonne continuation dans tous les cas.