HTML/XHTML  »  Guide  »  Guida HTML 

Approfondimenti sui form



L'attributo tabindex

Utilizzando il tasto "tab" della tastiera l'utente può passare da un campo del form all'altro. Per varie ragioni di impaginazione l'ordine così ottenuto potrebbe però non essere quello desiderato. Grazie all'attributo "tabindex" che si applica ai campi dei moduli è possibili specificare in quale ordine deve avvenire il passaggio da un campo all'altro. Il valore di questo attributo può variare tra 0 e 32767. Vediamo un esempio:

<form action="datiUtente">
 <fieldset>
  <legend>Dati utente</legend>

  <table width="300" border="1" cellspacing="0" cellpadding="5">
   <tr>
    <td>
     <label>Nome:
      <input tabindex="1" name="nome" type="text" size="30" maxlength="30"/>
     </label>
    </td>
    <td>
     <label>Professione:
      <input tabindex="3" name="professione" type="text" size="30" maxlength="100"/>
     </label>
    </td>
   </tr>

   <tr>
    <td>
     <label>Cognome:
      <input tabindex="2" name="cognome" type="text" size="30" maxlength="30"/>
     </label>
    </td>
    <td>&nbsp;</td>
   </tr>
  </table>
 </fieldset>
</form>

che viene così visualizzato:

Dati utente
 

come si può vedere, digitando il tasto "tab", l'ordine di passaggio da un campo all'altro non è quello indicato nell'HTML, ma è modificato secondo il valore di "tabindex".

Il layout dei form

Se siete alle vostre prima pagine HTML, può apparire difficile avere il controllo perfetto dei form. Si trovano validi suggerimenti tra gli articoli correlati alla guida:

  • I Form: segreti e trucchi di personalizzazione
  • I Form: risposte a domande frequenti

Ultimi articoli HTML/XHTML

Inserire video nelle pagine Web con HTML5

Codec, compatibilità dei browser, tools, codice e best practices per...

LungoJS: semantica HTML5 per il mobile

Realizzare layout per dispositivi mobili tenendo conto della...

Web storage, i cookies secondo HTML5

Come rendere persistenti i dati con HTML5

HTML5, section o article? ...E il div?

Cerchiamo di fare chiarezza sull'uso di questi due nuovi elementi e...

HTML5, la validazione del codice

Gli strumenti per verificare l'aderenza agli standard di pagine e...

Altri articoli

Guide HTML/XHTML

Guida HTML5

Una guida per conoscere e applicare da subito le novità introdotte...

Guida XHTML

XHTML è il nuovo standard per il WEB ed è la transizione verso...

Altre guide

Newsletter @Daily HTML.it

Ogni mattina, dal lunedì al venerdì, le novità pubblicate su tutti i siti tecnici del network HTML.it: articoli, guide, notizie dal Web, blog e molto altro.

Iscriviti alla newsletter

Altre newsletter

Corsi in aula

Corso Webmaster base

18 Giugno 2012 a Milano
Disponibilità: 6 Posti

Corso Google AdWords Base

25 Giugno 2012 a Milano
Disponibilità: 7 Posti

Corso Google AdWords Base

05 Giugno 2012 a Roma
Disponibilità: 7 Posti

Corso Webmaster base

11 Giugno 2012 a Roma
Disponibilità: 7 Posti