Controler les actions de la touche tabulation

**lipao17** · 15/12/2005, 09h19

Bonjour, j'ai une question tout bête :

j'ai un formulaire avec plusieurs champs et un bouton submit. Au chargement de ma page le curseur est sur (dans) le 1er champ, et à chaque fois que j'appuie sur la touche tabulation il va de champs en champs jusqu'au bouton submit. Jusqu'ici normal j'ai déclaré des tabindex.
Après le bouton submit si j'appuie encore sur la touche tabulation je vais dans la barre d'adresse.

Comment faire qu'il revienne sur le 1er champ au lieu d'aller dans la barre d'adresse ?

voici le code que j'ai tenté mais ça ne marche pas

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
<html>
 
<head>
<style type='text/css'>
input:focus{
background-color:red;
}
</style>
</head>
 
 
 
<body>
 
	<form name="monForm">
		<input type='text' name='input1' tabindex='1' />
		<input type='text' name='input2' tabindex='2' />
		<input type='text' name='input3' tabindex='3' />
		<input type='text' name='input4' tabindex='4' />
		<input type='text' name='input5' tabindex='5' />
		<input type='text' name='input6' tabindex='6' />
		<input type='submit' tabindex='7' onKeyPress='document.forms["monForm"].elements["input1"].focus();' onKeyUp='return;' onKeyDown='return;'/>
	</form>
 
</body>
 
<script type="text/javascript" language="Javascript">
	document.forms["monForm"].elements["input1"].focus();
</script>
 
</html>

quelqu'un a une idée de comment faire ça ?

**Loko** · 15/12/2005, 09h30

Tu peux peut etre rajouter une clause onKeypress sur ton bouton pour désactiver la touche tabulation ?

**lipao17** · 15/12/2005, 12h36

comment ?

c'est pas ce que j'ai fait ?

**franculo_caoulene** · 15/12/2005, 15h49

Salut,

As-tu essayé de placer ton instruction dans le onkeyup plutôt? De plus, il faut mettre le focus sur input1 seulement si on tape la touche tabulation.

Je dis ça sans conviction...

**shwin** · 15/12/2005, 15h55

je sais pas si c'est un prob pour ton appli, mais tu peux ne pas afficher la barre d'adresse si elle est inutile dans ton appli!

**lipao17** · 15/12/2005, 17h16

merci à vous de vos réponses

franculo_caoulene => non ça ne marche pas plus !!

shwin => ce n'est pas une bonne solution pour mon prob

**franculo_caoulene** · 15/12/2005, 21h31

Montre-nous ton code qui ne fonctionne pas s'il te plaît.

**lipao17** · 16/12/2005, 09h06

le voilà

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
<html>
	<head>
		<style type='text/css'>
			input:focus{
				background-color:red;
			}
		</style>
	</head>
 
	<body>
		<form name="monForm">
			<input type='text' name='input1' tabindex='1' />
			<input type='text' name='input2' tabindex='2' />
			<input type='text' name='input3' tabindex='3' />
			<input type='text' name='input4' tabindex='4' />
			<input type='text' name='input5' tabindex='5' />
			<input type='text' name='input6' tabindex='6' />
			<input type='submit' tabindex='7' 
				onKeyPress='return;' 
				onKeyUp='document.forms["monForm"].elements["input1"].focus();' 
				onKeyDown='return;'/>
		</form>
 
		<script type="text/javascript" language="Javascript">
			document.forms["monForm"].elements["input1"].focus();
		</script>
	</body>
</html>

**franculo_caoulene** · 16/12/2005, 10h13

Le code fonctionne sous Firefox mais pas sous IE, c'est uen première piste à voir. Peut-être est-ce impossible avec IE.

**lipao17** · 16/12/2005, 15h02

en fait ce code ne fonctionne ni sous ie ni sous firefox !!!

ça fait la même chose et il est très dur de garder le focus sur le bouton submit

**franculo_caoulene** · 16/12/2005, 15h52

Envoyé par franculo_caoulene

De plus, il faut mettre le focus sur input1 seulement si on tape la touche tabulation.

Dans ton code c'est lorsqu'on appuie sur n'importe quelle touche il faut que tu contrôle qu'on appuie uniquement sur la tabulation. Pour ce faire il faut intercepter le caractère ascii de la tabulation.
Sinon sous IE le focus passe quoiqu'il arrive par la barre d'adresse.

Controler les actions de la touche tabulation

JavaScript

Discussions similaires

Partager

Partager