Tecnología

Inicio

Cómo establecer el foco en una función de JavaScript

Cómo establecer el foco en una función de JavaScript


Dentro de una página HTML, el enfoque se refiere a qué elemento está establecido actualmente para la interacción del usuario. Generalmente se usa con las formas, el enfoque se aplica a los controles de usuario, tales como campos de entrada de texto, botones, casillas de verificación, botones de radio y listas desplegables. El usuario puede ajustar el enfoque haciendo clic en un elemento o utilizando su tecla "Tab" para moverse entre los elementos de la página. Como alternativa, los desarrolladores pueden ajustar el enfoque utilizando el cliente de script del lado de JavaScript. Esto puede mejorar la usabilidad de las páginas Web interactivas.

Instrucciones

1 Construir su página HTML. Si aún no lo ha hecho, cree una página HTML mediante la apertura de un nuevo archivo en un editor de texto y guardarlo con ".html" como la extensión, introduciendo el siguiente código de esquema:

<Html>

<Head>

</ Head>

<Body>

</ Body>

</ Html>

Esta es la forma básica de una página HTML, y puede contener muchos tipos diferentes de texto, medios de comunicación y los elementos interactivos. Incluir cualquier contenido que desee dentro del cuerpo de la página, entre la apertura y el cierre de las etiquetas "body".

2 Insertar el elemento que desea dirigir el foco, dándole un atributo "id". En el siguiente ejemplo se utiliza un campo de texto en un formulario:

<Form>

Escribir algo: <input type = "text" name = "txtfield" id = "entrada" />

</ Form>

Esto muestra el campo de entrada de texto en la página, con la "entrada" como su identificación. Los usuarios pueden escribir texto en el campo una vez que se centrará. En función de lo que esté sucediendo cuando el usuario visita la página, que tendrán que hacer clic en el campo, o pestaña a ella a través de otros elementos antes de que puedan ingresar texto.

3 El uso de JavaScript para encontrar el campo de texto. En su sección de cabecera de página, entre la apertura y el cierre de las etiquetas de "cabeza", entrar en una zona de código JavaScript:

<Script type = "text / javascript">

// Código va aquí

</ Script>

Entre las etiquetas "escritura" crear una función para localizar el campo de texto:

focusField función () {

var TField = document.getElementById ( "entrada");

}

Antes de poder centrar el elemento, el código JavaScript debe encontrar dentro de la estructura del documento. Mediante el uso de la identificación única del elemento de la secuencia de comandos puede mirar a través del documento, obtener el elemento y almacenar una referencia a él en una variable.

4 Enfoque su campo de texto utilizando JavaScript. Después de la línea de almacenar la referencia del elemento en una variable, incluya el código siguiente, centrándose en la interacción del campo de texto:

tField.focus ();

Cuando el campo se centra, el cursor debería aparecer dentro de ella en el monitor del usuario, lo que indica que está listo para escribir texto en.

5 Llame a su método de enfoque dentro de su página. Es necesario decidir si desea que el elemento para recibir la selección. En muchos casos, esto será cuando algún otro evento se produce dentro de la página, por ejemplo, la realización de otro campo de texto. Cuando esto ocurre, es necesario llamar al método instrucciones al navegador para centrarse en su elemento elegido. Este ejemplo muestra el elemento está prestando atención tan pronto como se carga la página, por el que se modifica el elemento HTML "cuerpo":

<Body onload = "focusField ()">

Guarde el archivo y probarlo en un navegador Web.

Consejos y advertencias

  • Puede pasar el nombre del elemento que se ha enfocado como un parámetro para el método "focusField" si esto se adapte a su página.
  • No asuma que su página está funcionando correctamente después de probarlo sólo en su propio navegador. funciones de JavaScript necesitan ser probados en todos los navegadores, ya que a menudo se comportan de forma impredecible.