El método de enfoque de JavaScript se utiliza para enfocar un elemento html. Establece el elemento como el elemento activo en el documento actual. Se puede aplicar a un elemento html a la vez en un documento actual. El elemento puede ser un botón, un campo de texto, una ventana, etc. Es compatible con todos los navegadores.
Sintaxis:
HTMLElementObject.focus()
Parámetros: No acepta ningún parámetro.
Valor devuelto: este método no devuelve ningún valor.
Código JavaScript para mostrar el funcionamiento de esta función:
Código: se enfoca en un campo de entrada al pasar el mouse sobre ese campo.
javascript
<html>
<head>
<script type="text/javascript">
function myFunction() {
document.getElementById("focus").focus();
}
</script>
</head>
<body>
<form action="#">
<br>
<br>
<label>
Hover me: </label>
<input type="text" onmousemove=myFunction() id="focus">
<!-- onmousemove is an event which occurs when someone
hovers the mouse on that particular element and calls
the function of javascript -->
<br>
<br>
<label>Without Focus: </label>
<input type="text">
<br>
<br>
<input type="button" value="submit">
</form>
</body>
</html>
Producción:
El campo de enfoque se puede eliminar con la ayuda del método blur() en javascript.
Sintaxis:
HTMLElementObject.blur()
Parámetros: Este método no acepta ningún parámetro.
Ilustración del método de desenfoque al hacer clic en un campo: Código:
javascript
<html>
<head>
<script type="text/javascript">
function setFocus() {
document.getElementById("focus").focus();
}
function removeFocus() {
document.getElementById("focus").blur();
}
</script>
</head>
<body>
<input type="button" onclick="setFocus()" value="set focus">
<input type="button" onclick="removeFocus()" value="remove focus">
<br>
<br>
<input type="text" id="focus">
</body>
</html>
Producción:
Después de hacer clic en establecer enfoque-
Después de hacer clic en quitar foco-
Publicación traducida automáticamente
Artículo escrito por revantjain y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA