Slabikář JavaScriptu – ostatní události

24. dubna 2002

•

Kromě událostí vyvolaných myší, které jsou popsány v přecházejícím dílu, jsou velmi užitečné i některé další. Jejich popis doplněný o příklady použití předkládám v dnešním pokračování.

OnKeyDown, OnKeyPress, OnKeyUp – všechny tři události vznikají při stlačení libovolné klávesy s výjimkou Ctrl, Shift a Alt. Události nastávají v následujícím pořadí:

OnKeyDown
OnKeyPress
OnKeyUp

To, jaká klávesa je stisknuta, lze zjistit prozkoumáním vlastnosti keyCode objektu event, jak bylo uvedeno v předcházejícím dílu.

Zde si ukažme, jak zjistit stisknutí klávesy Shift v případě, že nastala událost onKeyPress.

<html>
<head>
  <title>Funkční klávesy</title>
<SCRIPT LANGUAGE=“JavaScript“>
function Klavesa(e) {
  var shiftPressed = (window.Event) ? e.modifiers & Event.SHIFT_MASK : e.shiftKey;
  if (shiftPressed)
    alert(„Byla stisknuta klávesa SHIFT „);
}
</SCRIPT>
</head>
<body onKeyPress=“Klavesa(event)“>
<input type=“text“>
</body>
</html>

V principu stejně funguje i identifikace kláves Ctrl (CONTROL_MASK) a Alt (ALT_MASK). U těch jsou však omezení způsobená jejich funkčností – Ctrl+N například otevírá nové okno browseru, Ctrl+V je klávesová zkratka pro vložení obsahu schránky apod. Tyto funkce překryjí uvedené filtrování funkčních kláves.

OnLoad
Událost se váže k dokumentu nebo oknu prohlížeče. Nastává poté, co se dokončí natahování obsahu HTML dokumentu do prohlížeče.

OnUnload
Událost se opět váže k dokumentu nebo oknu prohlížeče. Nastává poté, co se uvolní zobrazovaná HTML stránka z paměti – ať již z důvodu zavření okna browseru nebo přesměrování na jiné URL.

OnBeforeUnload
Tato událost nastává před přesměrováním obsahu okna na jiné URL, případně před zavřením okna. Kód vložený do této události může přesměrování zrušit. OnBeforeUnload="return false" v tagu body způsobí zobrazení dialogu, který se dotáže, zda chcete opravdu opustit právě zobrazovaný dokument.

OnBlur
Událost vzniká při opuštění objektu ve chvíli, kdy objekt ztratí fokus. Užívá se především pro kontrolu správnosti vyplnění pole daty. Následující příklad zkontroluje, zda pole je vyplněno platným datumem nebo zůstalo prázdné a pokud ne, upozorní na to uživatele a vrátí fokus do tohoto pole. Datum je očekáváno ve tvaru dd.mm.yyyy

<html>
<head>
<script language=“JavaScript“>
function chyba(a) {
alert(„Datum je zadáno chybně“);
a.focus();
}

Metoda substring objektu String vybírá podřetězec podle zadaných argumentů: prvním je index znaku v řetězci, od kterého se má začít podřetězec tvořit, druhým je index znaku, který následuje za posledním znakem podřetězce.

Funkce Check nejprve zjistí, zda je datum zapsáno ve tvaru dd.mm.yyyy (tedy jestli obsahuje dvě tečky), pak do proměnných den, mesic a rok uloží zadaná čísla. Posléze pomocí metod setDate, setMonth a setFullYear těmito čísly definuje datum v objektu datTemp (měsíc má v JavaScriptu rozsah 0-11). Pro kontrolu na platnost zadaných datumových dat se používají metody getDate, getMonth a getFullYear. Pokud např. vložíte (metodami setDate, setMonth a setFullYear) do objektu Date datum 32.1.2002, nenastane chyba, ale datum se převede na 1.2.2002. Na tom je založena zpětná kontrola: pokud se tedy vkládaná čísla liší od těch, která jsou nakonec v tomto objektu obsažena, datum není platné.

Jistě by bylo možné najít i jiné řešení tohoto problému.

OnFocus
Událost může nastat na objektu, který může být zaměřen (získat fokus). Nejčastěji to bývají textová pole formuláře (případně i další ovládací prvky jako tlačítka, combo boxy apod.), ale může se jednat i o samotné okno prohlížeče, frame, hypertextový odkaz a další. U vyplňování formulářů může být tato událost použita třeba pro zobrazení krátké nápovědy, v jakém formátu se mají data do tohoto pole vypisovat, případně jaký druh dat do tohoto pole patří. Nápovědu lze zobrazit například ve stavovém řádku prohlížeče.

Datum: <input type=“text“ onfocus=“top.status=’Příklad položky: 27.2.2003′“>

OnResize
Událost, která se váže k objektu Window (oknu prohlížeče). Nastává vždy, když uživatel mění velikost okna prohlížeče

OnScroll
Opět událost objektu Window. Nastává při rolování dokumentem v okně prohlížeče.

Pozn. aut.: V článku jsou použity některé příklady z knihy JavaScript – praktické příklady, která vyšla v nakladatelství Grada. Příklady jsou převzaty a pozměněny se souhlasem nakladatele.