Discussion :

[ouedmouss]

Bonsoir.
J'ai un petit problem avec le composant select html (combo box) .
En fait lorsqu'on ait sur ce composant et que l'on presse les touches de directions (direction haut, bas, gauche,droite), la valeuer courante du select change.
Je veux annuler ce comportement.

En fait je suis en train de faire un script qui doit pouvoir permettre de naviguer via les touches de directions dans un table. Tout est ok a part que mon composant select, change sa valeur courante. lorsqu'on presse les touches indiquees.

Merci d'avance...

[SpaceFrog]

sur le onkeydown tu choppe le keycode qui correspond aux touches de direction et tu fais un return false...

[ouedmouss]

merci pour ta reponse...
Mais j'ai fais un petit exemple avec le code que tu a donne qui ne marche pas

le select html

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
 
<select id="comboTest">
				<option>
					Alpha solidarite
				</option>
				<option>
					Loc
				</option>
				<option>
					Lavigeri
				</option>
			</select>

Le code javascript

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
 
function init(){
	var select=document.getElementById("comboTest");
	select.addEventListener("keydown",test,false);
}
 
function test(e){
		if(window.event){ // IE
				keynum = e.keyCode
			}else if(e.which){ // Netscape/Firefox/Opera
				keynum = e.which
			}		
 
			if (keynum==38){//l'utilisateur a clique sur la touche haut
				return false;
			}
			if (keynum==40){//l'utilisteur a clique sur la touche bas
				return false;
			}
			if (keynum==39){//l'utilisateur a clique sur direction droite
				return false;	
			}
			if (keynum==37){//l'utilisateur a clique sur direction gauche
				return false;	
			}
			return true;
}
 
 
 
window.addEventListener("load",init,false);

La fonction test s'execute bien lorsqu'on saisie sur les touches de direction. Les keynum sont aussi ok (j'avais mis des alerts pour verifier tout ca)...
Mais le return n'a pas l'air d'empecher le changement de valeur du select....

Une idee

[SpaceFrog]

onmousedown ...

[ouedmouss]

Bonsoir..
C'est bien onkeydown.
Je ne veux pas que le changement soit effectue lorsqu'on tape (avec le clavier) sur lestouche de direction (ce qui est le comportement par defaut pour le composant html select).
J'ai implemente le return false. mais rien n'y fait ...
merci

[SpaceFrog]

Bon alors voici l'état d'avancement de mes recherches:

Ce code focntionne sous IE, mais il semble que firefox declenche tout de même le keypressed après le onkeydown, et ce makgré un stoppropagation
ce qui rend l'effet du preventDefault inutile ...

Si quelqu'un sait comment annuler le retour d'une touche de direction sous firefox ...

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
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
<title>Nouvelle page 1</title>
 <script type="text/javascript">
 
 
function test(event){
 	var keyNum
 	var IsIE=!!document.all;
	var event = event || window.event; 
	if (event.keyCode) {keyNum = event.keyCode;}
	else if (event.which) {keyNum = event.which; }
 
      //  alert(keyNum)
        switch (true){
        		case ( (keyNum>32 && keyNum<41) || keyNum==56 || keyNum==104 || keyNum==65464):     
        									if (IsIE) {event.returnValue = false;	}
        									else if (event.preventDefault) { 
 
        									event.preventDefault( );}
        									else {return false;}
        									break;
 
        		case ( keyNum==50|| keyNum==98 || keyNum==65458 ):  
							        		if (IsIE) {event.returnValue = false;	}
          									else if (event.preventDefault) {
 
          									event.preventDefault( );}
        									else {return false;}
        									break;
 
				case ( keyNum==54 || keyNum==102 || keyNum==65462 ):     
										   if (IsIE) {event.returnValue = false;	}
    										else if (event.preventDefault) { 
 
    										event.preventDefault( );}
        									else {return false;}
        									break;
 
				case ( keyNum==52 || keyNum==100 || keyNum==65460):     
        									if (IsIE) {event.returnValue = false;	}
        									else if (event.preventDefault) { 
 
        									event.preventDefault( );}
        									else {return false;}
        									break;
 
 
 
 
        }
 
}
</script> 
 
 
</head>
 
 
<body>
<select id='comboTest' onkeydown="test(event); " >
<option>un</option>
<option>deux</option>
</select>
 
</body>
 
</html>