Prezentacja zdarzeń w JS

Wstęp

JavaScript to język programowania, który umożliwia wdrożenie na stronie internetowej skomplikowanych elementów, dzięki którym strona ta może nie tylko wyświetlać statyczne informacje, ale również obsługiwać zmianę treść odpowiednio do sytuacji, wyświetlać interaktywne mapy i animacje grafiki 2D/3D , wyświetlać video itd. Jest to trzecia warstwa standardowych technologii internetowych Rdzeń języka JavaScript składa się z kilku funkcjonalności, które umożliwiają wykonanie rzeczy, takich jak te:

• Przechowywanie wartości w zmiennych.
  
  

Pod zmienne możemy podstawiać nie tylko liczby, ale teksty, funkcje, obiekty, tablice - czyli praktycznie dowolne rzeczy, na których będziemy pracować w naszych kodach. Nazwy zmiennych i stałych które deklarujemy nie mogą być byle jakie. Istnieją pewne zasady których musimy się trzymać. Wielkość liter ma znaczenie. Zmienna myTXT to nie to samo co mytxt, nazwa zmiennej nie może zaczynać się od cyfry, nazwa zmiennej nie może zawierać spacji, kropki, przecinka ani myślnika (można natomiast używać podkreślenia),nazwą zmiennej nie może być słowo kluczowe zarezerwowane przez JavaScript

• Operowanie na porcjach tekstu (zwanych w programowaniu "łańcuchami").
  
  

Łańcuchami nazywamy w programowaniu napisy (gdyż podobnie jak łańcuchy składają się z ogniw, tak napisy złożone są ze znaków). W praktyce łańcuch możemy zatem zwizualizować sobie jako tablicę, która indeksowana jest standardowo od zera.

• Uruchamianie kodu w odpowiedzi na określone zdarzenia zaistniałe na stronie internetowej
  
  
• I wiele więcej!
  
  

Zdarzenia

Interakcja JavaScript z HTML jest obsługiwana przez zdarzenia, które występują, gdy użytkownik lub przeglądarka manipuluje stroną. Gdy strona się ładuje, nazywa się to zdarzeniem. Gdy użytkownik kliknie przycisk, to kliknięcie również jest zdarzeniem. Inne przykłady obejmują zdarzenia, takie jak naciśnięcie dowolnego klawisza, zamknięcie okna, zmiana rozmiaru okna itp. Programiści mogą wykorzystać te zdarzenia do wykonania odpowiedzi zakodowanych w JavaScript, które powodują zamykanie okien, wyświetlanie komunikatów użytkownikom, sprawdzanie poprawności danych i praktycznie każdy inny możliwy do wyobrażenia rodzaj odpowiedzi. Zdarzenia są częścią modelu Document Object Model (DOM), a każdy element HTML zawiera zestaw zdarzeń, które mogą wyzwalać kod JavaScript.

Przykłady

Onpageshow- Zdarzenie ma miejsce gdy strona jest wyświetlana

After/before print- Zdarzenie miało miejsce po/przed rozpoczęciu drukowania strony

Resize- Zdarzenie ma miejsce, gdy zmienia się rozmiar widoku dokumentu (sprawdź scrollem myszy)

Mousedown- Zdarzenie ma miejsce, gdy użytkownik naciska przycisk myszy nad elementem

Mouseenter- Zdarzenie ma miejsce, gdy wskaźnik zostanie przeniesiony na element

Mouseleave- Zdarzenie ma miejsce, gdy wskaźnik zostanie przeniesiony poza element

Mousemove- Zdarzenie ma miejsce, gdy wskaźnik się rusza

Mouseover- Zdarzenie ma miejsce, gdy wskaźnik zostanie przeniesiony na element lub na jedno z jego elementów podrzędnych

Keypress- Zdarzenie ma miejsce, gdy użytkownik naciśnie klawisz

Keyup- Zdarzenie ma miejsce, gdy użytkownik zwolni klawisz

Change- Zdarzenie ma miejsce, gdy zmieni się zawartość elementu formularza lub innego elementu

Oncut- Zdarzenie ma miejsce gdy próbujemy wyciąć element

Oncopy- Zdarzenie ma miejsce gdy próbujemy skopiować element

Onpaste- Zdarzenie ma miejsce gdy próbujemy wkleić element

Ondrag- Zdarzenie ma miejsce gdy próbujemy przeciągnąć element

Pociągnij mnie!

Animacja- animationstart, animationiteration animationend