Les formulaires (partie 2) : Comment passer automatiquement au champ suivant lorsque la taille maximale. . .
Comment passer automatiquement au champ suivant lorsque la taille maximale du champ en cours est atteinte ?
:arrow: http://javascript.developpez.com/faq...js#TexteSuivat
- Pas de DOCTYPE dans le code HTML
- Présence d'un < au lieu d'un < dans une balise
- indentation html manquante
Citation:
Comment passer automatiquement au champ suivant lorsque la taille maximale du champ en cours est atteinte ?
Voici un exemple :
en XHTML 1.1
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
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>AutoTab Page</title>
<script type="text/javascript">
function Autotab(box, longueur, texte)
{
if (texte.length > longueur-1)
{
document.getElementById('TB'+box).focus();
}
}
</script>
</head>
<body>
<div>
<input type="text" size="5" maxlength="5" name="TB1" id="TB1" tabindex="1" onkeyup="Autotab(2, this.size, this.value)" />
<input type="text" size="2" maxlength="2" name="TB2" id="TB2" tabindex="2" onkeyup="Autotab(3, this.size, this.value);" />
<input type="text" maxlength="5" name="TB3" id="TB3" tabindex="3" />
</div>
</body>
</html> |
en HTML5 :
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
| <!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8" />
<title>AutoTab Page</title>
<script>
function Autotab(box, longueur, texte)
{
if (texte.length > longueur-1)
{
document.getElementById('TB'+box).focus();
}
}
</script>
</head>
<body>
<div>
<input type="text" size="5" maxlength="5" name="TB1" id="TB1" tabindex="1" onkeyup="Autotab(2, this.size, this.value)" />
<input type="text" size="2" maxlength="2" name="TB2" id="TB2" tabindex="2" onkeyup="Autotab(3, this.size, this.value);" />
<input type="text" maxlength="5" name="TB3" id="TB3" tabindex="3" />
</div>
</body>
</html> |
