2010-11-12 10 views
134

Est-il possible de régler la mise au point d'entrée par défaut sur un formulaire HTML sans utiliser JavaScript, par exemple:par défaut focus formulaire HTML sans JavaScript

<html> 
    <form> 
    Input 1: <input type="text" name="textbox1"/> 
    <br/> 
    Input 2: <input type="text" name="textbox2"/> 
    </form> 
</html> 

Je veux mettre le focus par défaut à l'une des boîtes de saisie lorsque le formulaire se charge sans utiliser JavaScript (car je veux que le comportement se produise lorsqu'un utilisateur a désactivé js).

Répondre

235

Vous pouvez le faire en HTML5, mais sinon, vous devez utiliser JavaScript.

HTML5 vous permet d'ajouter autofocus à votre élément de forme, par exemple:

<input type="text" name="myInput" autofocus /> 

Cela fonctionne dans les navigateurs qui prennent en charge HTML5 (Ou plutôt, les navigateurs qui prennent en charge cette partie de HTML5), mais comme vous le savez, tout le monde ne peut pas encore l'utiliser.

+8

Support du navigateur: Opera, Safari et Chrome. Firefox l'aura dans la version 4. IE ne le supporte pas, le support futur dans IE9 est actuellement inconnu. –

+0

Fonctionne parfaitement, Merci –

+3

[Support de navigateur de nos jours] (http://caniuse.com/#search=autofocus). –

0

Ceci n'est pas possible sans une forme de script. Même la page d'accueil de Google nécessite Javascript pour focaliser le champ de recherche.

+0

C'est. Google ajoute simplement javascript pour les navigateurs ne supportant pas HTML5. Quelque chose à considérer dans n'importe quelle application. – mvbrakel

-8

Vous pouvez utiliser l'attribut tabindex et utiliser la valeur la plus faible dans la zone de texte par défaut. Vérifiez ici pour le support du navigateur:

http://reference.sitepoint.com/html/object/tabindex#compatibilitysection

Le site suggère que

(dans presque tous les autres cas, à savoir former des contrôles et des liens-le tabindex offre un excellent support)

+3

L'attribut "tabindex" ne donne pas de focus automatique aux éléments, pas même un élément avec "tabindex = 1". En appuyant sur (ou un clic), vous devez activer le premier élément de la séquence de tabulation. –

3

Comme d'autres l'ont dit, sans Javascript, vous ne pouvez pas garantir un champ par défaut. Une autre option que vous pourriez vouloir essayer, si vous avez plusieurs champs qu'un utilisateur peut vouloir accéder utilise l'attribut accesskey. Cela signifie essentiellement un utilisateur peut revenir à l'un des champs instantanément plus tard au cours de la navigation, qui peut être utile pour les utilisateurs de lecteurs d'écran, etc ...

Wikipédias article sur ce sujet est très utile - http://en.wikipedia.org/wiki/Access_key

17

Quelque chose à savoir ... si vous définissez un élément de formulaire ciblé, toute personne utilisant la technologie assistée (AT) comme un lecteur d'écran devra sauvegarder pour voir les menus et tout autre contenu se trouvant avant le champ ciblé.

Une méthode préférée, à mon avis, est de ne pas mettre l'accent sur n'importe quel champ, sauf un saut de lien s'il est disponible. Cela leur donne la possibilité de passer au contenu des pages ou de lire la page de haut en bas.

+0

Ajout d'un skip-lien qui est visuellement caché aussi, mais accessible via des lecteurs d'écran serait génial! –

Questions connexes