Textarea Zeichen zählen klappt - Weitere Eingabe verhindern

[RageNo1]

Hallo,
ich muss eine Textarea begrenzen auf 500 Zeichen.

<script type="text/javascript">
function showCharsLeft() {
  charfield = document.getElementById('charsleft');
  messagefield = document.getElementById('nachricht');
  maxlength = messagefield.getAttribute('maxlength');
  charfield.value = (maxlength - messagefield.value.length);
}
</script>

<textarea maxlength="500" id="nachricht" onchange="showCharsLeft()" onkeyup="showCharsLeft()" name="nachricht" cols="30" rows="10" onfocus="if (this.value == 'Geben Sie hier Ihre Nachricht ein.') { this.value = ''; }">Geben Sie hier Ihre Nachricht ein.</textarea>

Das ganze funktioniert auch soweit.
Man klickt in die Textarea und der Text "Geben Sie hier Ihre Nachricht ein." verschwindet. Man gibt Zeichen ein und an anderer Stelle zählt ein Counter von 500 runter.

Ein Problem gibt es aber noch.
Wenn man über die 500 Zeichen hinausgeht geht der Counter im Minusbereich weiter: -1 -2 -3 usw.

Wie kann man nun eine Begrenzung einbauen dass jede weitere Eingabe automatisch verschwindet oder abgetrennt wird. (Alles was über 500 Zeichen hinausläuft.)

Ich hoffe hier eine Lösung zu finden, vielen Dank.

Gruß Ragey

 

[CPoly]

Die einfachste Lösung, die auch in jedem Browser funktionieren sollte, wäre mit substr oder substring.

var
	charfield = document.getElementById('charsleft'),
	messagefield = document.getElementById('nachricht'),
	maxlength = messagefield.getAttribute('maxlength');

function showCharsLeft() {
	var charsRemaining = maxlength - messagefield.value.length;
	
	if(charsRemaining < 0) {
		messagefield.value = messagefield.value.substr(0, 500);
		charsRemaining = 0;
	}
	
	charfield.value = charsRemaining;
}

 

[RageNo1]

Vielen Dank für die Hilfe!