Beperk het aantal tekens in een tekstveld

Introductie

Een van de beperkingen van HTML is niet toestaan ​​dat de limiet van tekens die u typt in een textarea.

Terwijl de tekstvakken hebben maxlength attribuut, dat de aard van de personages buiten de vastgestelde numerieke limiet kan remmen, heeft het tekstveld geen native een soortgelijk attribuut en de cheque moet worden gedaan in programmatische manier.

Natuurlijk moet je van mening dat, voor zowel de tekstvakken en de handige maxlength, textarea met zowel het systeem dat we zullen zien, dit is een client-side controle omzeild door savvy gebruikers.

Zo kan bijvoorbeeld een tekstvak in deze eenvoudige manier om het aantal tekens de gebruiker kan typen te beperken:

 



 <input type="text" name="testo" maxlength="100">

 

De grens, in het voorbeeld, is ingesteld op 100 tekens en de gebruiker zal niet in staat om het karakter schrijven 101 vanaf.

In een dergelijk geval wij van mening dat het goed is om de gebruiker te waarschuwen dat een limiet om te voorkomen dat, afgeleid, blijven (denken) te schrijven zonder daadwerkelijk iets te schrijven, dus:

 Schrijf uw tekst (max. 100 tekens) <br>







 <input type="text" name="testo" maxlength="100">

Voorafgaand aan de analyse van de voor-en nadelen van het onderwerp in dit artikel analyseren we het onderwerp van het artikel met een voorbeeld.

Beperking van tekens in een tekstveld met een count-up

In een HTML-bestand dat u maakt de volgende tekst gebied:

 <form name="modulo">







 <textarea name="testo" cols="30" rows="5" onkeyup="ContaCaratteri()"> </ textarea>







 <input type="text" name="conta" value="0" readonly>







 </ Form>

Eerst maken we een formulier waar we een naam toewijzen en vervolgens een tekst gebied dat onkeyup gebeurtenis (dat wil zeggen: als je type) van de JavaScript-functie oproepen die we binnenkort bespreken.

Tot slot maken we een tekstvak waar het aantal tekens dat u het type lijkt te zijn nul (0), als standaard, het maximum aantal toegelaten.

We hebben niet de knop die de centrale doelstelling van het script in kwestie niet relevant is.

We zien de JavaScript-functie ContaCaratteri () genoemd in het tekstveld onkeyup evenement:

 <script type="text/javascript">







 ContaCaratteri function ()







 {



    



 document.modulo.conta.value = document.modulo.testo.value.length;



    



 var max = 500;



    



 if (document.modulo.testo.value.length> max)



    



 {



        



 document.modulo.testo.value document.modulo.testo.value.substr = (0, max);



        



 document.modulo.conta.value = maximum;



        



 alert ("Max" + max + "tekens");



    



 }







 }







 </ Script>

Het is heel eenvoudig:

• toe te wijzen aan het tekstvak het aantal tekens momenteel in het tekstveld;
• we het maximum aantal tekens;
• controleren of het aantal getypte tekens groter is dan het toegestane maximum;
• Als de bovenstaande situatie zich voordoet het script gestopt met het snijden van de string tot aan het maximum aantal toegestane tekens door het resetten van het maximum aantal tekens in het tekstvak en de lancering van een alarm waarschuwing.

Op deze manier de waarde van het tekstvak zal beginnen vanaf nul (0) en stopt bij de grens.

Het voorbeeld is ingesteld op 500 tekens om waar te zijn, maar om snel te testen, probeer dan om de waarde van de variabele "maximum" ingesteld op 10.

• <<
• 1
• 2
• 3
• >>