Cómo establecer el enfoque de un elemento de formulario HTML en JavaScript

Cómo establecer el enfoque de un elemento de formulario HTML en JavaScript
El enfoque en el elemento se refiere a la sección de la página actualmente activa. En el presente documento, un elemento HTML puede centrarse en una vez, que podría ser una ventana, un cuadro de texto o un botón. En formularios HTML, el campo de entrada debe ser un elemento activo, ya que muchos elementos no permiten enfocarse de forma predeterminada. Entonces, para centrarse en los elementos, use el HTMLEMENT.Método Focus ().

Esta publicación de blog ilustrará el proceso de establecer el enfoque en un elemento de un formulario HTML en JavaScript.

Cómo establecer el enfoque de un elemento de formulario HTML en JavaScript?

Para establecer el enfoque en un elemento de un formulario HTML, se puede utilizar el método JavaScript Focus (). Para hacerlo, llame a este método mientras lo pasa el objeto del elemento que debe centrarse.

Sintaxis
Siga el método mencionado a continuación para centrarse en un elemento de un formulario HTML:

Htmlelement.enfocar()

Intentemos algunos ejemplos para ver cómo centrarnos en un elemento mientras está en la página de carga o en el flujo de un elemento.

Ejemplo 1: Establezca el enfoque de un elemento de formulario HTML en la carga de la página
En el ejemplo dado, estableceremos el enfoque en el campo de texto de entrada en la carga de la página. Por lo tanto, cree un formulario con un campo de texto de entrada que estará activo mientras la página se carga:



El formulario HTML se verá así:

Como puede ver, la salida anterior muestra un campo de entrada que no está activo. Entonces, para centrarse en este cuadro de texto, use el código JavaScript otorgado a continuación:

ventana.onload = function ()
documento.getElementById ("texto").enfocar();

En las líneas de código anteriores:

  • Defina una función en el "ventana.encendido" evento.
  • Llama a "enfocar()"Método obteniendo el elemento HTML"caja de texto"Usando su identificación asignada con la ayuda del"getElementById ()" método.

La salida correspondiente será la siguiente:

El GIF anterior indica que el cuadro de texto está activo en la carga de la página.

A continuación, veamos cómo establecer el enfoque en el campo de entrada mientras se desplaza en el elemento.

Ejemplo 2: Establezca el enfoque de un elemento de formulario HTML en flotar el elemento
Para establecer el enfoque en el cuadro de texto mientras se desplaza en él, use el "el ratón por encima"Event Listener:



Defina una función llamada "elementfocus ()"Eso se activará mientras se produce el evento Mouseover:

función elementfocus ()
documento.getElementById ("texto").enfocar();

La salida muestra que el cuadro de texto estará activo mientras el mouse se cierne sobre él:

Hemos proporcionado la información esencial relacionada con el enfoque del elemento HTML en forma HTML utilizando JavaScript.

Conclusión

Para centrarse en un elemento de un formulario HTML en JavaScript, use el "Htmlelement.enfocar()" método. Se puede configurar en los elementos HTML como "caja de texto","botón" etcétera. Puede establecer enfoque en el elemento mientras está en la carga de la página o en cualquier otro evento. Este blog ilustra el proceso para centrarse en un elemento de un formulario HTML en JavaScript.