Události Javascriptu - Builder.cz - Informacni server o programovani

Rubriky
Odběr fotomagazínu

Fotografický magazín "iZIN IDIF" každý týden ve Vašem e-mailu.
Co nového ve světě fotografie!

 

Zadejte Vaši e-mailovou adresu:

Kamarád fotí rád?

Přihlas ho k odběru fotomagazínu!

 

Zadejte e-mailovou adresu kamaráda:



JavaScript

Události Javascriptu

24. září 2001, 00.00 | Základní seznámení s událostmi. Dozvíte se třeba, jak změnit pozadí stránky v závislosti na poloze kurzoru. Velice důležitý díl, protože události jsou základem programování v JS.

Úvod

Vše, co jsem vám zatím v JS ukázal se odehrávalo například hned po načtení stránky. Spuštění skriptů bylo předem přesně načasováno. Jistě jste však viděli stránky, kde byly skripty provedeny například po stisku tlačítka myšky, najetí kurzoru na obrázek (který se pak třeba změnil v jiný obrázek) a podobně. Za většinu toho, co se stane když ... mohou události.

Události

Jako událost si prostě můžete představit změnu. Pokud pohnete kurzorem po stránce, je to změna, změní se hodnota souřadnici kurzoru. Změna je také třeba vyplnění formuláře, stisk tlačítka, přesunutí okna z jednoho místa na druhé, přesunutí okna do pozadí a podobně.

JavaScript vám umožňuje události "hlídat" a reagovat na ně. Takovou reakcí je nejčastěji vykonání určitého skriptu, který je připraven pro obsluhu události. V JavaScriptu je definováno několik událostí, na které je možno reagovat. Ke každé události existuje správce události. Ten událost rozpozná a bude na událost reagovat.

Správce událostí

O správce událostí definované JavaScriptem lze doplnit většinu značek HTML. Abych byl zase trochu praktický, ukáži vám jeden takový příklad, kdy se změní text ve stavovém řádku prohlížeče po najetí myší na text odkazu.

<HTML>
<HEAD>
<TITLE>Odkaz se zmenou</TITLE>
</HEAD>
<BODY>

<P>Vítám Vás a mám tu pro Vás speciální 
<a href="https://www.builder.cz"
 onMouseOver= "window.status='Builder';return true">odkaz na...
</a>
odpověď naleznete ve stavovém řádku.</P>

</BODY>
</HTML>

V tomto případě je správcem události onMouseOver, jenž rozpozná, kdy je se kurzor přesune nad odkaz a podle toho se zachová.

Příkaz return true ovládá, jak se bude stránka chovat v případě, že kurzor myšky z textu odkazu zmizí. Jestliže skript obsahuje tento příkaz a kurzor přesunete mimo odkaz, zůstane text ve stavovém řádku, a nezmění se ani pokud se na odkazu znovu objeví kurzor. Pokud příkaz vynecháte, stavový řádek není blokován pro správce událostí.

Změna pozadí stránky

Tento další skript poukazuje, co také dokáže JavaScript. Pokud se kurzor objeví nad určitým textem, změní se barva pozadí stránky.

<HTML>
<HEAD>
 <TITLE>Odkaz se zmenou</TITLE>
</HEAD>
<BODY>
 <P>Pozor, pokud najedete na ten odstavec tam dole, tak ...</P>
 <P></P>
 <P onMouseOver = "document.bgColor = 'red' ; return true">
 Pokud na tento text zabloudí tvůj kurzot, zmením pozadí na červené.
 </P>
</BODY>
</HTML>

Změna obrázku po najetí myšky

Ukáži vám již použitelný skript, kdy se změní obrázek, objeví-li se na něm kurzor.

<HTML>
<HEAD>
 <TITLE>Odkaz s obrazkem</TITLE>
 <SCRIPT LANGUAGE="JavaScript">
 <!--
   function over()
    {
     document.images[0].src="krizek.jpg";
    }
   function pryc()
    {
     document.ok.src="ok.jpg";
    }
 //-->
 </SCRIPT>
</HEAD>
<BODY>
  <A HREF="nekam.html" onMouseOver="over();" onMouseOut="out();">
  <IMG SRC="ok.jpg" NAME="ok"></a>
</BODY>
</HTML>

Možná trochu složitější skript, pravda, ale na podrobný popis si budete muset počkat, až do článku, který bude celý pojednávat pouze o práci s obrázky, jinak se ničím neliší od předchozích, snad jen použitím funkcí, které jsem vysvětlil jednom z minulých dílů.

Popis událostí

Události jsou velmi podstatné (moderní programování je na tom částečně založeno), proto je popíši. Popis by měl být výstižný, ne zbytečně obsáhlý.

onAbort - událost nastane při přerušení načítání obrázku. Většinou je tak učiněno při stisku tlačítka Zastavit, kdy obrázek se nestihl načíst. Váže se pouze na element IMG.

onBlur - událost nastane při změně stavu okna nebo formulářového prvku, tzv. když se prvek stane neaktivním, například když se okno stane neaktivní.

onChanget - událost nastane v případě, že změníte obsah formuláře - například při změně pulldown menu.

onClick - událost nastane při stisknutí (jedno stisknutí, pokud jsou to dvě rychlá stisknutí jëdná se o událost onDblClick) tlačítka myšky.

onDblClick - událost nastane po dvou rychlých stiscích tlačítka myšky.

onFocus - událost nastane, když se okno prohlížeče/formulářový prvek stane aktivní.

onKeyDown - událost nastane při stisku libovolné klávesy na klávesnici.

onKeyPress - prakticky totožné s onKeyDown.

onKeyUp událost nastane při spuštění stisknuté klávesy.

onLoad - k události dojde, když je stránka plně načtena v okně prohlížeče. Váže se pouze na element BODY a FRAMESET.

onMouseDown - událost nastane při stisku libovolného tlačítka myšky.

onMouseMove - událost nastane při změně polohy kurzoru myšky, tzv. pokud se kurzor pohybuje.

onMouseOut - událost nastává, když se kurzor vzdálí od určitého objektu stránky.

onMouseOver - událost je spuštěna, když se kurzor myšky přesune nad určitý objekt.

onMouseUp - událost vyvoláte spuštěním stisklého tlačítka.

onReset - událost je vyvolána stisknutím tlačítka reset ve formuláři.

onResize - událost nastane při změně velikosti okna prohlížeče. Váže se pouze na elementy BODY, FRAMESET a FRAME.

onSelect - událost nastane při označení textu na aktuální stránce, případně při označení textu ve formuláři.

onSubmit - událost nastane při odeslání formuláře (tlačítko submit).

onUnLoad - událost nastane při uzavření aktuální stránky (ne prohlížeče), tzv. pokud uživatel nechá prohlížeč načíst novou stránku.

Obsah seriálu (více o seriálu):

Tématické zařazení:

 » Rubriky  » JavaScript  

 » Rubriky  » Web  

Poslat článek Diskuse (0) Tisk Přečteno: 3709x

www.builder.cz/rubriky/javascript/udalosti-javascriptu-155897cz

 

 

 

Nejčtenější články
Nejlépe hodnocené články
Krátké zprávy

 

Přihlášení k mému účtu

Uživatelské jméno:

Heslo: