En este artículo, estableceremos el límite de entrada de caracteres en el área de texto, incluido el recuento en jQuery. Para establecer el carácter límite en el área de texto de entrada, usamos la propiedad de longitud.
Acercarse:
Creamos un área de texto de entrada con una longitud máxima dada y luego usamos el código jQuery para limitar los caracteres. Primero, establecemos el límite máximo y luego usamos el método keyup() para reducir el límite de caracteres del área de texto en 1 cuando hacemos clic en el botón y mostramos el conteo en la pantalla.
Sintaxis:
var max_length = 25;
$('textarea').keyup(function () {
var len = max_length - $(this).val().length;
$('.GFG').text(len);
});
Ejemplo:
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<title>
How to limit character input
in the textarea including
count in jQuery?
</title>
<!-- Import jQuery cdn library -->
<script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>
<script>
$(document).ready(function () {
var max_length = 25;
$('textarea').keyup(function () {
var len = max_length - $(this).val().length;
$('.GFG').text(len);
});
});
</script>
</head>
<body style="text-align: center;">
<h1 style="color: green;">
GeeksforGeeks
</h1>
<h3>
How to limit character input
in the textarea <br>including
count in jQuery?
</h3>
<form>
<p>Maximum input characters: 25</p>
<textarea maxlength="25"></textarea>
<p>
<span class="GFG">25</span>
Characters Remaining
</p>
</form>
</body>
</html>
Producción:
