Come capire quando un controllo è messa a fuoco

September 1

Come capire quando un controllo è messa a fuoco


Quando si sposta il cursore di una casella di controllo o di tipo parole in una casella di testo, si verifica un evento onfocus. Nella programmazione Web, "focus" si riferisce a una proprietà che controlli dell'interfaccia utente in possesso. Come sviluppatore, potrebbe essere necessario sapere quando un visitatore del sito fa clic su un controllo o schede ad esso utilizzando il tasto "Tab". Poche righe di codice JavaScript darà le pagine Web in grado di rilevare importanti eventi onFocus.

istruzione

1 Lanciate il vostro editor HTML o Notepad.

2 Aprire il file della pagina Web HTML e aggiungere questo codice al di sotto del primo tag <body> nel documento:

<Input id = tipo "Text1" = "text" onfocus = "processFocus (questo)" />

<Input id = tipo "Text2" = "text" onfocus = "processFocus (questo)" />

Questo crea due caselle di testo. I loro ID sono Text1 e Testo2. Ogni casella di testo definisce un gestore di eventi onfocus. Quando una casella di testo viene attivato, il browser chiamare la funzione JavaScript denominato "processFocus" e passarlo un riferimento alla casella di testo.

3 Aggiungere il seguente codice alla sezione <head> del documento:

<Script type = "text / javascript">

Funzione processFocus (controlName) {

var = controlWithFocus controlName.id;

alert (controlWithFocus + "ha il focus");

}

</ Script>

4 Salvare il file.

5 Aprire Esplora risorse e individuare il file. Fare doppio clic su di esso. Si aprirà nel browser. Posizionare il cursore nella prima casella di testo. Il codice JavaScript in grado di rilevare che la casella di testo è attivo e visualizzare "Text1 è attiva."

6 Posizionare il cursore nella seconda casella di testo. Vedrete il messaggio "Testo2 è attiva."

Consigli e avvertenze

  • Aggiungere l'evento onfocus ad alcun controllo che richiedono il rilevamento di messa a fuoco. Ad esempio, per visualizzare un messaggio quando un utente schede a un controllo di un'area di testo, aggiungere un evento onfocus a tale controllo. È quindi possibile esaminare il valore della variabile controlWithFocus per determinare quando un utente schede a quel controllo.