El focusin() es un método incorporado en jQuery que se usa para enfocarse en el elemento seleccionado.
Sintaxis:
$(selector).focusin(function);
Parámetro: Acepta un parámetro opcional “función” que gana foco en el elemento seleccionado.
Valor devuelto: Devuelve el elemento seleccionado que gana su foco.
Código jQuery para mostrar el funcionamiento del método focusin():
Código #1:
En el siguiente código, se pasa la función de parámetro.
html
<html>
<head>
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>
<!-- jQuery code to show the working of this method -->
<script>
$(document).ready(function() {
$("div").focusin(function() {
$(this).css("background-color", "green");
});
});
</script>
<style>
div {
border: 2px solid black;
width: 50%;
padding: 20px;
}
input {
padding: 5px;
margin: 10px;
}
</style>
</head>
<body>
<!-- click inside the field focusin will take place -->
<div>
Enter name:
<input type="text">
<br>
</div>
</body>
</html>
Salida:
Antes de hacer clic dentro del campo de entrada-
Después de hacer clic dentro del campo de entrada, el método de enfoque estará en acción.
Código #2:
En el siguiente código, no se pasa ningún parámetro.
html
<html>
<head>
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>
<!-- jQuery code to show the working of this method -->
<script>
$(document).ready(function() {
$("#foc").click(function() {
$(this).focusin().css("background-color", "lightgreen");
});
});
</script>
<style>
div {
border: 2px solid black;
width: 50%;
padding: 20px;
}
input {
padding: 5px;
margin: 10px;
}
</style>
</head>
<body>
<!-- click inside the field focusin will take place and
background color becomes change -->
<div>
Enter name:
<input id="foc" type="text">
<br>
</div>
</body>
</html>
Salida:
Antes de hacer clic dentro del campo de entrada-
Después de hacer clic dentro del campo de entrada, el método de enfoque estará en acción.
Publicación traducida automáticamente
Artículo escrito por kundankumarjha y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA