JavaScript - sprawdzanie poprawności adresu e-mail, długości ciągu, zaznaczanie pola formularza, zliczanie znaków, ograniczenie znaków w formularzu, wyrażenia regularne
| DZIAŁANIE: |
Sprawdzanie adresu e-mail :Sprawdzenie długości ciągu :Sprawdzenie czy podano liczbę :Zaznaczanie zawartości pola formularza :Zliczanie znaków :Ograniczenie znaków pola textarea : |
Kod:

Ewentualne Objaśnienia:
Tutaj przedstawiam wam kilka naprawdę praktycznych przykładów zastosowanie JS
z formularzami.
Omówię troszeczkę każdy z przykładów :
Sprawdzanie poprawności e-mail :
Przykład ten opiera się na wyrażeniach regularnych, nie będę po raz
kolejny tłumaczył tego zagadnienia, odsyłam do takiego niemalże przykładu
(walidacja e-mail), ale w moim kursie PHP, gdzie również wytłumaczyłem istotne
sprawy związane z wyrażeniami regularnymi, wejdź
TUTAJ ! W PHP stosowaliśmy ereg, eregi lub preg_match tutaj mamy match
- sprawdzamy czy zmienna mail odpowiada wyrażeniu zapisanemu w zmiennej wzor.
Jeśli tak nie jest match zwraca NULL . Match można również użyć do sprawdzenia
czy dana zmienna zawiera jakiś ciąg znaków. Więcej znajdziesz pod :
http://www.w3schools.com/jsref/jsref_match.asp .
Sprawdzanie długości podanego ciągu :
To jest bardzo prosty przykład, zastosowane w nim metody doskonale już znacie
więc nie będę tego omawiał szczegółowo.
Sprawdzanie czy podano liczbę :
Tutaj nowością jest funkcja isNan - jeżeli wywołamy funkcję parseInt
(znacie już ją) z parametrem, który nie jest liczbą zostanie zwrócona wartość
Not a Number (NaN). No właśnie tutaj sobie sprawdzamy w tej sposób czy w
formularzu podano liczbę.
Zaznaczenie zawartości pola formularza :
Tutaj ustawiamy sobie zaznaczenie zawartości pola textarea po kliknięciu na
przycisk (jego akcja onClick). Jak widzicie na listingu kodu w momencie
kliknięcia wykonywane są dwie instrukcje javascript:this.form.text.focus()
oraz this.form.text.select() . Focus jak zapewne się domyślacie (znając
choćby CSS) powoduje przejście do pola (tutaj o nazwie text). Następnie dla tego
pola jest wywołane select() co jak nietrudno się domyślić powoduje
zaznaczenie tekstu
Zliczanie wpisanych znaków :
Tutaj korzystamy ze zdarzenia onkeyup - czyli zdarzenie związane z
klawiaturą, a dokładnie zwolnienie jakiegoś klawisza (nie trudno się domyślić,
że istnieje również zdarzenie onkeydown). W momencie wywoływana jest odpowiednia
funkcja, która w pole tekstowe wpisuje ile wpisano już znaków w pole textarea.
Ograniczenie wpisanych znaków :
Ponownie korzystamy z onkeyup. Wywołujemy funkcję, w której jaka parametr
pokazujemy, że max długość wpisanego ciągu znaków to 25. Funkcja sprawdza czy
nie przekroczono tej wartości, jeśli tak pojawia się alert oraz pole textarea
jest blokowane (właściwość disabled na true) . W przeciwnym razie
obliczana jest różnica między max długością, a już wpisaną co daje nam liczbę
znaków jakie jeszcze można wpisać. Wartość ta jest wyświetlana w polu tekstowym.