Az előadás letöltése folymat van. Kérjük, várjon

Az előadás letöltése folymat van. Kérjük, várjon

HTML 2. Űrlapok

Hasonló előadás


Az előadások a következő témára: "HTML 2. Űrlapok"— Előadás másolata:

1 HTML 2. Űrlapok

2 Űrlapok elemei Gombok  Jelölőnégyzetek  Választókapcsolók  Legördülő menűk Beviteli mezők Fájl-kiválasztók Rejtett elemek Objektum-vezérlők

3 FORM Űrlap mező Tulajdonságai: action Kötelező mező – szerveroldali feldolgozás method (GET|POST) GET – HTTP feldolgozási módszer enctype kódolás accept feltöltött fájl MIME-típusa name az űrlap neve onsubmit – a jóváhagyáskor végrehajtódó szkript neve onreset – az alapbeállítást kieszközölő szkript neve accept-charset – az elfogadott karakterkészletek listája

4 FORM - példa 1.Példa...az űrlap magja... 2.Példa...az űrlap magja...

5 INPUT 1. Beviteli elem Kulcsszava –Input Több típusa van Type értékei: –"(TEXT | PASSWORD | CHECKBOX | RADIO | SUBMIT | RESET | FILE | HIDDEN | IMAGE | BUTTON)„ Pl.

6 INPUT 2. Type típusai: TEXT – szöveges bevitel PASSWORD – jelszó megadása CHECKBOX – jelölőnégyzetek RADIO – választókapcsolók SUBMIT – jóváhagyás RESET – alapbeállítás FILE – állományböngészés HIDDEN – rejtett IMAGE – kép BUTTON - gomb

7 INPUT 3. INPUT főbb mezői: type = text|password|checkbox|radio|submit|reset|file|hidden|image|button name = név value = checked/diasable/readonly érték (radio és checkbox-ok számára) size = méret maxlength = maximálisan hány karakter lehet a beviteli mezőben scr = forrás a képmezők számára Pl.

8 INPUT - példa Név: Férfi

9 INPUT – jelszó példa Felhasználónév: Jelszó: Figyelem!A felhasználói név látszik, míg a jelszó rejtve marad!

10 BUTTON Gomb Főbb tulajdonságai: name = neve value = értéke type = submit|button|reset –submit – jóváhagy –button – egyszerű gomb –reset - alapbeállítás

11 BUTTON - példa Név: Elküld Alaphelyzet

12 SELECT Opciók kiválasztása name = név size = méret multiple = többszörös kiválasztás

13 OPTION A kiválasztható elemek selected = ki van választva value = értéke label = címkéje, megnevezése OPTGROUP Az Elemek csoportosítása

14 SELECT - példa Járművek BMW Audi F-112 MIG-21

15 TEXTAREA Szövegdoboz Főbb tulajdonságai: name = név rows = sorok száma cols = oszlopok száma

16 TEXTAREA – példa Ez már be van írva ide. Ez is, de új sorból!

17 ISINDEX Egysoros beviteli mező Pl. Ugyan az, mint az INPUT-tal létrehozott beviteli mező Pl. Keresés:

18 LABEL Címkék, feliratok Főbb mezője for = a vezérlőelem id mezőjében megadott név, amelyiknek a címkét szánjuk a vezérlőelemnél mek kell adni az id mezőt Pl. Vezetéknév:

19 FIELDSET Mezők csoportosítása … űrlapelemek…

20 FIELDSET – példa Adataim Név: Cim: Közérzet? Jó Rossz Egyebek Magamról:

21 Szkriptek Az űrlapok adatait feldolgozó szkriptek: JavaScript VBScript PHP Tcl stb.

22 Javascript document.write(" Hello Világ! ")

23 Javascript A böngésző JavaScript lehetőségei: Nincs JavaScript támogatás!

24 Javascript – gomb kep1="gomb0.gif"; kep2="gomb1.gif"; function egerbemozog() { document.gomb.src=kep2; } function egerkimozog() { document.gomb.src=kep1; }

25 Javascript

26 VBScript Sub edit1_changed() If edit1.value = "abc" Then button1.enabled = True Else button1.enabled = False End If End Sub

27 PHP Számológép "> a= b= Művelet: a+b a-b a*b a/b $a $muvelet $b = $eredm "; } ?>

28 Tcl proc edit1_changed {} { if {[edit value] == abc} { button1 enable 1 } else { button1 enable 0 } } edit1 onChange szoveg_changed

29 CSS – stíluslapok h1 {color: red} h3 {color: blue} This is header 1 This is header 3

30 Linkek szeged.hu/bibl/eforras/tananyag/informatika/paja /index.htmhttp://www.bibl.u- szeged.hu/bibl/eforras/tananyag/informatika/paja /index.htm asznalata/oldal/2.htmlhttp://www.prog.hu/cikkek/423/HTML+urlapok+h asznalata/oldal/2.html


Letölteni ppt "HTML 2. Űrlapok"

Hasonló előadás


Google Hirdetések