2009-08-31 6 views
0

Comment certains sites sélectionnent-ils automatiquement un champ de saisie lorsque vous entrez dans une page? Comme la page de connexion de YouTube, il sélectionne automatiquement le champ Nom d'utilisateurComment sélectionner automatiquement un champ de saisie lorsque je charge une page?

Ce site aussi, à la page Poser une question, par exemple, sélectionne le champ Titre.

Comment font-ils cela? Ma conjecture serait javascript

Mais comment?

+1

@Daniel Moralea: Juste une note, l'action à laquelle vous faites référence s'appelle focus. La sélection est une bête différente. – vmarquez

Répondre

2
<head> 
<!-- set focus to a field with the name "searchcontent" in my form --> 
<script type="text/javascript"> 
    function setfocus(a_field_id) { 
     $(a_field_id).focus() 
    } 
</script> 
</head> 

<body onload="setfocus('customervalue');"> 

Customer: <input name="customer" id="customervalue" /> 

</body> 

D'ici: http://lena.franken.de/software/javascript/index.html

2

dans l'avenir: <input type="text" autofocus> :-)

Ce n'est pas une bonne idée d'utiliser onload sur le corps, utilisez un onDomReady-event, par exemple de YUI ou jQuery ou un script personnalisé à la place.

1

La plupart des sites font actuellement cela avec des autofocusers JavaScript, comme indiqué dans d'autres réponses ici. Mais si vous envisagez d'implémenter un comportement similaire, sachez que cela peut être gênant pour certains utilisateurs en raison du fonctionnement du JavaScript. Par exemple, si vous mettez un champ différent pendant qu'une page est en cours de chargement, le JavaScript peut vous «aider» en déplaçant le focus et en vous faisant taper dans le mauvais champ. This question sur ui.stackexchange.com énumère quelques inconvénients supplémentaires. Pour éviter cela, HTML5 a introduit un autofocus attribute pour les éléments de formulaire, ce qui signifie que le comportement sera toujours implémenté par le navigateur lui-même et peut être désactivé pour les utilisateurs qui le trouvent irritant. Bien sûr, ceci n'est pas encore supporté par tous les navigateurs. Pour plus d'informations, voir la section sur autofocus fields dans l'excellent livre Dive Into HTML5 de Mark Pilgrim.

Questions connexes