Znajdujesz się na stronach starej wersji serwisu!
Aktualną wersję znajdziesz pod adresem webmade.org.

Zliczanie znaków w textarea

Często występuje potrzeba zliczania liczby znaków wpisanych w pole formularza. Przeważnie jest to spowodowane określoną liczbą znaków mogącą się zmieścić w komórce tabeli bazy danych. Wszystko wydawałoby się proste - krótki skrypt JS i jest ok... No niestety! tak łatwo to to nie będzie:-). Dlaczego? Tym razem Nawala FF... Jak? Zamiast zliczać enter jako 2 znaki '\r\n\' liczy jako jeden - '\n'. (ukośniki się nie liczą). Ale można to łatwo obejść. Starczy tylko dodać kilka linijek kodu do skryptu:

<html>
<head>
<title>Zliczanie znaków

<script type="text/javascript">
function zliczaj(nr_f, nr_l, nr_t) {
with(document.forms[0]) {

var tekst = elements[nr_t].value; // cały text z pola textarea
var dl_tresc = elements[nr_t].value.length; // długoś tekstu z textarea
var maxlen = 30; // maxymalna dozwolona długość
var prawdziwa = 0; // licznik znaków
var entery = 0;

for (i=0; i<dl_tresc; i++) {
if (tekst.charAt(i) == "\n") {
prawdziwa++;
entery++;
if (navigator.appName != "Netscape") i++;
}
prawdziwa++;
} // koniec for i

elements[nr_l].value= maxlen - prawdziwa; // wyświetl komunikat o licznie znaków

if (prawdziwa>maxlen) {
if (navigator.appName != "Netscape")
elements[nr_t].value = elements[nr_t].value.substring(0,maxlen);
else
elements[nr_t].value = elements[nr_t].value.substring(0,maxlen-entery);

elements[nr_l].value = 30 - maxlen;
alert("Maksymalna długość to " + maxlen +"!");
}
} // koniec with
} </script>
</head>
<body>
<form action="#">
<input type="text" size="3" name="licznik" /> - pozostało znaków
<textarea name="tresc" onkeyup="zliczaj(0,0,1)" cols="20" rows="5">Tu wpisz tresc</textarea>
</form>

</body>
</html>

No i wszystko działa! Można oczywiście ten skrypt wrzucić do osobnego pliku, i wykorzystać na kilku stronach. Właśnie dlatego nie zrobilem tu na sztywno kodu, używając nazw pól formularza, tylko odwoływałem się do indexu elements[nr] i forms[nr]. Dzięki temu, zmieniając parametry przekazywane do funkcji przy zdarzeniu 'onkeyup' (na puszczenie klawisza), można dostosować to do każdego formularza. Do funkcji przekazuje kolejno - index formularza [u mnie 0], index licznika [u mnie 0 - pierwsze pole formularza] oraz index pola tekstowego - 2.

Przydatny link: JS w osobnym pliku

Patryk 'yarpo' Jar

efekt z porady

- pozostało znaków

© 2004-2006 by webmade.org
kamieniarstwo :linki sponsorowane
valid xhtml
valid css