Well, I have a input for the user to put the name, and under the input I have both the typed characters and the maximum amount (0/50).
I wanted you to type in the characters you type, and when you reach the limit you can not type anymore.
And also when erasing a character, decrease the typed characters ...
A very practical way is to first put a maxlength="50" in the field to limit the number of characters and the script below to change the counter by counting the number of characters entered:
document.querySelector("input[name='nome']") // seleciona o campo pelo atributo "name"
.addEventListener("input", function(){ // evento "input" que detecta mudança de valor no campo
var cars = this.value.length; //conta a quantidade de caracteres
// se for menor ou igual a 50, altera texto com o valor no span
if(cars <= 50) document.querySelector(".limite").textContent = cars;
});<input type="text" name="nome" maxlength="50">
<span class="limite">0</span>/50 Hello, it's very simple to do this
$(document).ready(function(){
$('#iddocampo').keyup(function(){// evento jquery quando o cara digita
var campo = $("#iddocampo").val();
var qtde = campo.length;// max characteres
});
});
You can also use the input maxlength="50" onkeypress="return functionJS ()"
function funcaoJS(){
var qtde = document.getElementById("iddocampo").value.length;
}