Les formulaires (partie 2) : Comment passer automatiquement au champ suivant lorsque la taille maximale. . . [Fait]

**Auteur** · 27/04/2013, 16h58

Comment passer automatiquement au champ suivant lorsque la taille maximale du champ en cours est atteinte ?

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

Comment passer automatiquement au champ suivant lorsque la taille maximale du champ en cours est atteinte ?

Voici un exemple :

en XHTML 1.1

Code html :

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
<!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 html :

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
<!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>

**NoSmoking** · 16/11/2013, 15h26

Je ne mettrais que la version HTML5.

**Auteur** · 16/11/2013, 18h22

Ce qui donne

Comment passer automatiquement au champ suivant lorsque la taille maximale du champ en cours est atteinte ?

Voici un exemple en HTML5 :

Code html :

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
<!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>

Les formulaires (partie 2) : Comment passer automatiquement au champ suivant lorsque la taille maximale. . . [Fait] [FAQ]

Contributions JavaScript / AJAX

Discussions similaires

Partager

Partager