[FAQ] Donner le focus à un element

**Thes32** · 18/06/2008, 12h36

Puisque les gens se posent la question sur le comment placer le curseur le de texte dans un champ juste après le chargement de la page comme dans google par exemple, voici ma petite contrib.

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
 
<html>
 <head>
  <script language="JavaScript" type="text/javascript">
   window.onload = function() {
   document.forms["f"].elements["first"].focus();
   };
  </script>
 </head>
 <body>
  <form name="f">
   <input type="text" name="first" 
    value="votre mot ici" />
  </form>
 </body>
</html>

**Gatsu35** · 18/06/2008, 14h37

merci d'éviter de continuer à utiliser les anciennes techniques de DOM et de montrer aux débutant comment on parcoure proprement un DOM
d'où l'utilisation de l'id et de document.getElementById notamment :

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
 
<html>
 <head>
  <script language="JavaScript" type="text/javascript">
   window.onload = function() {
      document.getElementById('fieldToFocus').focus();
   };
  </script>
 </head>
 <body>
  <form name="f">
   <input type="text" id="fieldToFocus" name="first" 
    value="votre mot ici" />
  </form>
 </body>
</html>

**Thes32** · 18/06/2008, 14h47

Merci Gatsu35,

j'ai pas trop le goût du DOM, je ferais des efforts à l'avenir!

**SpaceFrog** · 18/06/2008, 15h18

sauf que le window.onlaod ne fonctionne pas toujours !

Code :

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

1
2
3
4
5
6
7
8
9
10
<html>
 <head>
 
 </head>
 <body onload=" document.getElementById('first').focus();">
  <form name="f">
   <input type="text" name="first" value="votre mot ici" id="first"/>
  </form>
 </body>
</html>

Edit ...
comme on doit donner le focus à un élément précis, autant passer par l'id ...

**Thes32** · 18/06/2008, 15h35

Mon idée était de séparer le JS et le html
plus simple oui

[FAQ] Donner le focus à un element

Contribuez

Discussions similaires

Partager

Partager