Nwlapcug.com


Come impostare lo stato attivo in una funzione JavaScript

Come impostare lo stato attivo in una funzione JavaScript


All'interno di una pagina HTML, lo stato attivo si intende quale elemento è attualmente impostato per l'interazione dell'utente. Generalmente utilizzato con forme, messa a fuoco si applica ai controlli utente come campi di immissione testo, pulsanti, caselle di controllo, pulsanti di opzione e gli elenchi a discesa. L'utente può impostare lo stato attivo facendo clic su un elemento o utilizzando il loro tasto "Tab" per spostarsi tra gli elementi della pagina. In alternativa, gli sviluppatori possono impostare lo stato attivo utilizzando script sul lato client in JavaScript. Questo può migliorare l'usabilità in pagine Web interattive.

Istruzioni

1

Costruisci la tua pagina HTML. Se non si è già provveduto, è possibile creare una pagina HTML di apertura di un nuovo file in un editor di testo e salvarlo con ". html" come l'estensione, immettere il seguente codice di struttura:

< html >

< head >

< / head >

< corpo >

< / body >

< / html >

Questa è la forma di base di una pagina HTML e può contenere diversi tipi di testo, multimediali ed elementi interattivi. Includere contenuto che ti piace all'interno del corpo della pagina, tra l'apertura e il tag di chiusura "corpo".

2

Inserire l'elemento che si desidera assegnare lo stato attivo, dandogli un attributo "id". L'esempio seguente utilizza un campo di testo all'interno di un modulo:

< forma >

Qualcosa tipo: < input type = "testo" nome = id "txtfield" = "voce" / >

< / form >

Questo consente di visualizzare il campo di testo all'interno della pagina, con "voce" come relativo ID. Gli utenti possono digitare il testo nel campo di una volta con lo stato attivo. A seconda di cosa succede quando l'utente Visualizza la pagina, dovranno fare clic sul campo o sulla scheda ad esso tramite altri elementi prima possono immettere testo.

3

Utilizzare JavaScript per individuare il campo di testo. Nella tua pagina sezione head, tra l'apertura e chiusura tag "testa", immettere un'area per il codice JavaScript:

< script type = "text/javascript" >

qui va il codice

< / script >

Tra i tag "script" è possibile creare una funzione per individuare il campo di testo:

Function focusField() () {

tField var = document.getElementById('entry');

}

Prima è possibile concentrarsi l'elemento, il codice JavaScript deve trovare all'interno della struttura di albero del documento. Utilizzando l'ID univoco dell'elemento, lo script può guardare attraverso il documento, è necessario ottenere l'elemento e archiviare un riferimento ad esso in una variabile.

4

Fuoco del campo di testo utilizzando JavaScript. Dopo la riga il riferimento all'elemento di memorizzazione in una variabile, è necessario includere il seguente codice, messa a fuoco l'interazione sul campo di testo:

tField.focus();

Quando il campo è focalizzato, il cursore dovrebbe apparire all'interno di esso sul monitor dell'utente, che indica che è pronto per essere digitato il testo.

5

Chiamare il metodo focus all'interno della pagina. È necessario decidere se si desidera che l'elemento che riceverà lo stato attivo. In molti casi si tratta quando si verifica un altro evento all'interno della pagina, ad esempio il completamento di un altro campo di testo. In questo caso, è necessario chiamare il metodo istruire il browser a fuoco il vostro elemento scelto. In questo esempio viene illustrato l'elemento dato fuoco, non appena viene caricata la pagina, modificando l'elemento "body" di HTML:

< onload="focusField() del corpo" >

Salvare il file ed eseguirne il test in un browser Web.

Consigli & Avvertenze

  • È possibile passare il nome dell'elemento da essere focalizzato come parametro per il metodo "focusField" se questo si adatta la tua pagina.
  • Non date per scontato che la pagina funzioni correttamente dopo il test solo nel proprio browser. Funzioni JavaScript devono essere testati attraverso browser come si comportano spesso in modo imprevedibile.