JAVASCRIPT (cz. IV) ĆWICZENIA DO SAMODZIELNEGO WYKONANIA materiały dydaktyczne dla słuchaczy opracowanie: 2004-2007 by Arkadiusz Gawełek, Łódź



Podobne dokumenty
Przetwarzanie dokumentów XML i zaawansowane techniki WWW Zdarzenia w JavaScript (Zajęcia r.)

Krótki kurs JavaScript

CZYM JEST JAVASCRIPT?

Zdarzenia Zdarzenia onload i onunload

JavaScript - wykład 4. Zdarzenia i formularze. Obsługa zdarzeń. Zdarzenia. Mysz. Logiczne. Klawiatura. Beata Pańczyk

Kurs WWW wykład 6. Paweł Rajba

HTML ciąg dalszy. Listy, formularze

Tworzenie aplikacji internetowych E14

Wykład 03 JavaScript. Michał Drabik

Podstawy JavaScript ćwiczenia

Projektowanie stron WWW

JavaScript. mgr inż. Remigiusz Pokrzywiński

Atrybuty znaczników HTML

Podstawy JavaScript. <script type="text/javascript"> kod skryptu </script>

JAVAScript w dokumentach HTML (1) JavaScript jest to interpretowany, zorientowany obiektowo, skryptowy język programowania.

Zajęcia 4 - Wprowadzenie do Javascript

Kurs HTML 4.01 TI 312[01]

LABORATORIUM 2 WSTĘP DO SIECI TELEINFORMATYCZNYCH TABELE I FORMULARZE

Aplikacje WWW - laboratorium

Format HTML. Wybrane działy Informatyki Stosowanej. Definicja i przeznaczenie Struktura dokumentu Znaczniki Formularze i komponenty

Cw.12 JAVAScript w dokumentach HTML

Najprostszy dokument HTML. <html> <body> Dowolny tekst. </body> </html>

Aplikacje WWW - laboratorium

Celem ćwiczenia jest zapoznanie z językiem HTML i JavaScript, zasadami tworzenia stron WWW i umieszczania na nich skryptów w języku JavaScript.

HTML cd. Ramki, tabelki

Aplikacje internetowe

Podstawy programowania w języku JavaScript

EGZAMIN POTWIERDZAJĄCY KWALIFIKACJE W ZAWODZIE Rok 2019 CZĘŚĆ PRAKTYCZNA

WYKŁAD 4 JĘZYK JAVASCRIPT CZĘŚĆ 1

Ćwiczenie 7 - Formularze

Miejsce na naklejkę z numerem PESEL i z kodem ośrodka. Wypełnia zdający. Numer PESEL zdającego*

EGZAMIN POTWIERDZAJĄCY KWALIFIKACJE W ZAWODZIE Rok 2019 CZĘŚĆ PRAKTYCZNA

JAVAScript w dokumentach HTML (1)

FORMULARZE Formularz ma formę ankiety, którą można wypełnić na stronie. Taki formularz może być np. przesłany pocztą elektroniczną .

DOM i JavaScript DOM W3C

Techniki WWW. (HTML, CSS, JavaScript) Dr inż. Marcin Zieliński WYKŁAD 6. Środa 15:30-17:00 sala: A-1-04

Wprowadzenie do języka JavaScript

Bazy Danych i Usługi Sieciowe

EGZAMIN POTWIERDZAJĄCY KWALIFIKACJE W ZAWODZIE Rok 2019 CZĘŚĆ PRAKTYCZNA

EGZAMIN POTWIERDZAJĄCY KWALIFIKACJE W ZAWODZIE Rok 2019 CZĘŚĆ PRAKTYCZNA

EGZAMIN POTWIERDZAJĄCY KWALIFIKACJE W ZAWODZIE Rok 2019 CZĘŚĆ PRAKTYCZNA

Metoda inline przypisywania zdarzeń polega na określeniu zdarzenia wewnątrz znacznika. Na przykład:

EGZAMIN POTWIERDZAJĄCY KWALIFIKACJE W ZAWODZIE Rok 2018 CZĘŚĆ PRAKTYCZNA

EGZAMIN POTWIERDZAJĄCY KWALIFIKACJE W ZAWODZIE Rok 2019 CZĘŚĆ PRAKTYCZNA

obecnie tabeli nie stosuje się do budowy struktury witryny (stosuje się za to pozycjonowanie elementów i warstwy) faktycznie wymagają

JAVAScript tablice, przekazanie danych do funkcji, obiekty Date i window

Umieszczanie kodu. kod skryptu

EGZAMIN POTWIERDZAJĄCY KWALIFIKACJE W ZAWODZIE Rok 2018 CZĘŚĆ PRAKTYCZNA

EGZAMIN POTWIERDZAJĄCY KWALIFIKACJE W ZAWODZIE

Formularze HTML. dr Radosław Matusik. radmat

Podstawy informatyki. Informatyka stosowana - studia niestacjonarne. Grzegorz Smyk

Rys.2.1. Drzewo modelu DOM [1]

Dokumentacja Skryptu Mapy ver.1.1

JAVAScript w dokumentach HTML (2)

Laboratorium Wstawianie skryptu na stroną: 2. Komentarze: 3. Deklaracja zmiennych

JAVAScript w dokumentach HTML - przypomnienie

Aplikacje WWW - laboratorium

Komponent Formularz. Rys. 1. Strona programu Joomla - Rys. 2. Instalacja komponentu

TECHNOLOGIE INTERNETOWE WYKŁAD 6. JavaScript Funkcje i obiekty

Okna, ramki i ciasteczka

FORMULARZE. G. Przęczek

HTML (HyperText Markup Language) hipertekstowy język znaczników

Obiektowe bazy danych

1 z 18. Spis treści: 1. Zakładanie konta na portalu OX.PL

Zakładanie konta na portalu OX.PL Uruchamianie linku aktywacyjnego Co zrobić w przypadku kiedy link nie dotarł na skrzynkę mailową Dodawanie ogłoszeń

I. Podstawy języka C powtórka

Aplikacje internetowe - laboratorium

Politechnika Poznańska Wydział Budowy Maszyn i Zarządzania

WTYCZKA FARA-TCM Dane techniczne dla twórców zewnętrznych aplikacji do obsługi map cmentarza

SSK - Techniki Internetowe

INSTRUKCJA OBSŁUGI BIULETYNU INFORMACJI PUBLICZNEJ

INSTRUKCJA UŻYTKOWNIKA PORTALU SIDGG

XML extensible Markup Language. część 5

JAVASCRIPT PODSTAWY. opracowanie: by Arkadiusz Gawełek, Łódź

Wprowadzenie do języka HTML

ELF. Instrukcja użytkownika. (System wspomagający wypełnianie wniosków elektronicznych)

DOM i JavaScript DOM W3C

DOM (Document Object Model)

POLITECHNIKA ŚLĄSKA ZADANIE 1 - "PESEL" Studenckie Koło Naukowo-Informatyczne Link

Tworzenie stron internetowych z wykorzystaniem HTM5, JavaScript, CSS3 i jquery. Łukasz Bartczuk

Zaawansowane aplikacje internetowe

Umieszczanie skryptów

Doładowania telefonów

Formy dialogowe w środowisku Gnome

Edytor tekstu OpenOffice Writer Podstawy

Utworzenie interfejsu graficznego za pomocą formularza użytkownika w VBA

Kalkulator. Programowanie komputerów. Kalkulator możliwe udoskonalenia. Kalkulator. Kalkulator. Kalkulator możliwe udoskonalenia

Ilość cyfr liczby naturalnej

JavaScript. Wstęp do podstaw elementów. dr inż. Paweł Boiński, Politechnika Poznańska

SYSTEM ZARZĄDZANIA DANYMI OSOBOWYMI - INSTRUKCJA UŻYTKOWNIKA

Wyrażenie include(sciezka_do_pliku) pozwala na załadowanie (wnętrza) pliku do skryptu php. Plik ten może zawierać wszystko, co może się znaleźć w

JAVASCRIPT PODSTAWY. opracowanie: by Arkadiusz Gawełek, Łódź

Zajęcia 13 wykorzystanie MySQL w PHP cz. 2

Dokumentacja Rodzica. aplikacji. Wirtualna szkoła

Programowanie w C/C++ Instrukcje - konstrukcje powtórka. LABORKA Piotr Ciskowski

Instrukcja użytkowa programu INTERNET LAB-BIT

XHTML, CSS i JavaScript. Pierwsza pomoc

W dowolnej przeglądarce internetowej należy wpisać poniższy adres:

Funkcje i instrukcje języka JavaScript

Tworzenie stron internetowych z wykorzystaniem HTM5, JavaScript, CSS3 i jquery. Łukasz Bartczuk

Transkrypt:

JAVASCRIPT (cz. IV) ĆWICZENIA DO SAMODZIELNEGO WYKONANIA Ćwiczenie 1 obliczanie daty Wielkanocy Napisz skrypt, który: poprosi użytkownika o podanie roku z przedziału 1900..2099 sprawdzi, czy podana wartość mieści się w żądanym zakresie (jeśli NIE wyświetli komunikat o błędzie i zakończy skrypt) obliczy datę wielkanocy dla podanego roku, w tym celu, zastosuje algorytm (patrz załącznik). ZAŁĄCZNIK DO ĆW. 1: ALGORYTM OBLICZANIA DATY WIELKANOCY 1. Oblicz stałe p i q rok p q Do roku 1582 15 6 1583-1699 22 2 1700-1799 23 3 1800 1899 23 4 1900 2099 24 5 2100 2199 24 6 2. Wyznacz resztę z dzielenia roku przez 19 (a) 3. Wyznacz resztę z dzielenia roku przez 4 (b) 4. Wyznacz resztę z dzielenia roku przez 7 (c) 5. Wyznacz resztę z dzielenia 19a+p przez 30 (d) 6. Wyznacz resztę z dzielenia 2b+4c+6d+q przez 7 (e) 7. Niedziela Wielkanocna przypada dnia d+e dni po 22 marca - jeżeli jednak z obliczeń wypadnie data późniejsza niż 25 kwietnia, to należy ją przesunąć o tydzień do tyłu. Ćwiczenie 2 weryfikacja i interpretacja numeru PESEL Napisz skrypt, który: poprosi użytkownika o podanie numeru PESEL sprawdzi, czy podana wartość ma 11 znaków składa się z samych cyfr PESEL istnieje (zgodna cyfra kontrolna, patrz załącznik) (jeśli dowolny z powyższych warunków jest NIE spełniony - wyświetli odpowiedni komunikat o błędzie i zakończy skrypt) obliczy datę urodzenia (w formacie dd.mm.rrrr) oraz płeć osoby na podstawie numeru PESEL, wiedząc że: funkcja string.charat(index) zwraca znak znajdujący się w obiekcie string na index-owej pozycji, przy czym, pierwszy znak ma index 0, drugi 1 itd., np. funkcja string.length zwraca długość łańcucha tekstowego przykład użycia imie = Arkadiusz; x=imie.charat(3); //x będzie równe a y=imie.charat(7); //y będzie równe s z=imie.length; //z będzie równe 9 1

ZAŁĄCZNIK DO ĆW. 2: WERYFIKACJA I INTERPRETACJA NUMERU PESEL 1. Kolejne wagi poszczególnych cyfr (pierwszych dziesięciu) w PESEL wynoszą: 1, 3, 7, 9, 1, 3, 7, 9, 1, 3. Pomnóż cyfry przez odpowiadające im wagi, a potem zsumuj iloczyny (wynik nazwijmy suma). 2. Oblicz resztę z dzielenia suma przez 10 (nazwijmy ją x) 3. Ostatnia cyfra w PESEL musi być równa: 10-x (wyjątek w przypadku gdy x=0 ostatnia cyfra = 0) 4. Pierwsze dwie cyfry to dwie ostatnie cyfry roku urodzenia 5. Dwie kolejne cyfry modulo 20 to miesiąc urodzenia 6. Te same dwie cyfry DIV 20 to stulecie (0 oznacza 19xx, 1 oznacza 20xx (albo 15xx), 2 oznacza 21xx (albo 16xx) itd. 7. Piąta i szósta cyfra to dzień urodzenia 8. Dziesiąta cyfra oznacza płeć (jeżeli parzysta kobieta; nieparzysta mężczyzna). FUNKCJE i FORMULARZE 1. Formularze - uzupełnienie dotychczasowej wiedzy Szczególną uwagę należy zwrócić na naywanie poszczególnych elementów (wartości podkreślone w przykładzie). Dzięki tej właśnie nazwie będziemy rozpoznawać poszczególne formularze i ich elementy. Wstawiany przycisk otrzymał nowy parametr: onclick="licz()" gdzie: onclick zdarzenie kliknięcia, może być np. onmouseover zdarzenie najechania myszką na obiekt, bez kliknięcia Licz() nazwa fukcji (bez parametrów), która będzie wywołana i wykonana <TABLE CELLSPACING=0 CELLPADDING=0 BORDER=0> <FORM NAME=fm> <TR> <TD><INPUT TYPE=text NAME=liczba1> * </TD> <TD><INPUT TYPE=text NAME=liczba2> = </TD> <TD><INPUT TYPE=button VALUE=Policz onclick="licz()"></td> <TD><INPUT TYPE=text NAME=wynik></TD> </TR> </FORM> </TABLE> 2. Funkcje Deklaracja funkcji: function Nazwa(argumenty) {instrukcje_do_wykonania}; Odwołanie do obiektów, np. wartości pola tekstowego o nazwie wynik, będącego częścią formularza o nazwie fm: fm.wynik.value, czyli w ogólnieniu obiekt.metoda.właściwość <SCRIPT language = "JavaScript"> function Licz() { fm.wynik.value=fm.liczba1.value*fm.liczba2.value; } </SCRIPT> 2

Ćwiczenie 3 Klient podaje wartość umowy zlecenia obliczamy podatek i dochód netto przy uwzględnieniu 20% kosztów uzyskania i 19% podatku zaokrąglenia! (podstawa opodatkowania do 1 zł; podatek do 10 groszy) spróbuj zmienić onclick() na np. onkeypress() zaokrąglanie realizuje Math.round(liczba) Ćwiczenie 4 Klient podaje dochód roczny my obliczamy podatek wg skali: dochód (zł) do 37.024 zł 37.024-74.048 ponad 74.048 obliczenie podatku 19 proc. podstawy obliczenia minus kwota 530 zł 08 gr 6.504 zł 48 gr plus 30 proc. nadwyżki ponad 37.024 zł 17.611 zł 68 gr plus 40 proc. nadwyżki ponad 74.048 zł Ćwiczenie 5 Należy obliczyć zwrot poniesionych kosztów transportu (wg wzrou: liczba kilometrów razy stawka). Stawka jest uzależniona od: Rodzaj pojazdu Stawka za 1 km Samochód osobowy o pojemności do 900cm 3 Samochód osobowy o pojemności silnika powyżej 900cm 3 Motocykle 0,4894 zł 0,7846 zł 0,2161 zł Wykorzystaj instrukcję switch: switch (zmienna) { case wartość_1: instrukcja; break; case wartość_2: instrukcja; break; case wartość_3: instrukcja; break; case wartość_4: instrukcja; break; ( ) } Wykorzystaj listę rozwijaną. Wybrana pozycja to nazwa_formularza.nazwa_listy.selectedindex (0 pierwsza pozycja z listy,1 druga itd). Reakcja na zmianę wybranej pozycji na liście: onchange() 3

ZAŁĄCZNIK - ZDARZENIA onmouseover onmouseout onclick onmouseup* ondblclick* onmousedown* onmousemove* Wywoływane jest w momencie, gdy najedziemy wskaźnikiem myszy na obiekt. Wywoływane jest w momencie, gdy opuszczamy obiekt wskaźnikiem myszy. Wywoływane jest, gdy klikniemy przycisk myszy na obiekcie (bez przytrzymania). Wywoływane jest, gdy puścimy przycisk myszy na obiekcie. Wywoływane jest, gdy podwójnie klikniemy przycisk myszy na obiekcie (bez przytrzymania). Wywoływane jest, gdy trzymamy przyciśnięty przycisk myszy na obiekcie. Wywoływane jest, gdy poruszymy myszką na obiekcie. button^, checkbox^, document, image^, img^, layer, link, map, password^, radio^, reset^, select^, submit^, text^, textarea^, window button, checkbox, image^, img^, layer^, link, map, password^, radio, reset, submit button, checkbox, image^, layer^, link, map, password^, radio, reset button, checkbox, document^, img^, layer^, link, map, password^, radio, reset, submit, window^ button^, checkbox^, image^, img^, layer, link, map^, password^, radio^, reset^, select^, submit^, text^, textarea^ ZwiązZne z klzwizturą i myszką onfocus onblur onchange onselect onsubmit onreset Wywoływane jest, gdy wchodzimy w formularza lub okna. Wywoływane jest, gdy opuszczamy pole formularza lub okna. Wywoływane jest, gdy opuszczamy pole tekstowe, którego zawartość została zmieniona. Wywoływane jest, gdy zaznaczymy cały lub część tekstu wewnątrz pola tekstowego. Wywoływane jest, gdy zażądamy wysłania formularza, zazwyczaj poprzez naciśnięcie przycisku Submit. Wywoływane jest, gdy zażądamy wyczyszczenia formularza poprzez naciśnięcie przycisku Reset. button, checkbox, document, frame, image^, link, map, password, radio, reset, select, submit, text, textarea, window checkbox^, file, password, radio^, select, text, textarea password^, file^, text, textarea^ form 4

onkeypress* onkeydown* onkeyup* Wywoływane jest, gdy klikniemy klawiaturą Wywoływane jest, gdy klikniemy klawiaturą Wywoływane jest, gdy zwolnimy klawiaturę file, password, text, textarea ZwiązZne z łzdowzniem onload onunload onerror Wywoływane jest po załadowaniu dokumentu do przeglądarki. Umieszczane w bloku <BODY> oraz <IMG>. Wywoływane jest w momencie zmieniany wyświetlanej strony. Umieszczane w bloku <BODY>. Wywoływane jest, gdy przeglądarka nie może załadować rysunku lub strony. document, image, window document, window image, document^ onabort Wywoływane jest, gdy użytkownik przerywa ładowanie obrazka. image ZwiązZne z oknem onresize* onmove* Wywoływane jest, gdy użytkownik zmieni rozmiar okna przeglądarki. Wywoływane jest, gdy użytkownik porusza oknem przeglądarki. window tylko NN * - dotyczy tylko nowych przeglądzrek NetscZpe NZvigZtor 4.0+ i Microsoft Internet Explorer 4.0+ ^ - dostępne tylko w Explorerze. 5