Dare il focus ad un elemento
Per ‘dare il focus ad un elemento’ si intende posizionare il cursore della tastiera su di un preciso elemento di pagina. Gli elementi che possono avere il focus della tastiera sono esclusivamente gli elementi di input come ,per esempio, input text e radio button.
Può essere utile avvolte poter assegnare il focus ad un elemento in pagina programmaticamente. Potremmo volere posizionare il focus appena un form in pagina è stato caricato oppure assegnarlo a un elemento su cui la validazione dell’input è fallita… per tutto ciò ci viene in aiuto, come sempre, il nostro amato javascript.
Il metodo focus(), che è definita dall’interfaccia HTMLInputElement specificata dallo standard DOM (standard W3C), ci permette di fare proprio quello che vogliamo. È sufficiente invocarlo sull’elemento di input che dovrà acquisirlo:
1 2 function setFocusOn( id ) { 3 4 var inputText= document.getElementById( id ); 5 inputText.focus(); 6 7 }
Possiamo utilizzare questa funzione al caricamento di un form:
<body onLoad = "setFocusOn('inputText')">
<form>
<input type="text" id="inputText">
</form>
</body>
Oppure in fase di validazione lato client degli input:
1 2 ... // altro codice 3 4 if( isInvalidLoginName( name ) ) { 5 setFocusOn( nameInputId ); 6 alert( 'Il nome immesso contiene caratteri non validi' ); 7 } 8 9 ... // altro codice 10
