Програмиране в Интернет - теория - 5/10

Програмиране в Интернет - теория - 5/10

7) ФУНКЦИИ ЗА ОБРАБОТКА НА СЪБИТИЯ

1. Какво е функция за обработка на събития.
Това е предварително дефинирана ключова дума в JavaScript, която се използва за обработване на дадено събитие от Web страница. Събитието е нещо, което се случва когато потребителят извърши някакво действие (щракване с мишката, щракване върху бутон и т. н.).
2. Използване на функции за обработка на събития.
Функцията за обработка на събитие се добавя като допълнителен атрибут към HTML тага, като стойността на атрибута може да бъде JavaScript код, заграден с кавички.

Пример:
<HTML>
<BODY>
<FORM>
<INPUT type=”button” onClick=”window.alert (‘здравей!’);”>
</FORM>
</BODY>
</HTML>

3. Основни функции за обработка на събития:
а) събитието Click (onClick)

Събитието Click настъпва, когато потребителят щракне върху определени области от Web страницата. Тези области се намират в елементи от форми и връзки. В горния пример събитието Click настъпва при натискане на бутон от формуляр, създаден чрез тага <INPUT> и предизвиква поява на прозорец за предупреждение.

Пример:
<HTML>
<BODY>
<A HREF=”http://www.nagradi.bg” onClick=”window.alert (‘Това е адресът на страницата с наградите’); return false”> Награди </A>
</BODY>
</HTML>

Тук след появата на прозорецът за предупреждение, ако не се върне стойност false чрез return, ще се зареди страницата.
б) събитието Mouseover (onMouseOver)
Събитието Mouseover настъпва, когато потребителят премести показалеца на мишката над хипервръзка. Ако в примера от а) вместо onClick използваме onMouseOver, предупреждението се появява при посочване на хипервръзката.
в) събитието Mouseout (onMouseOut)
Това събитие настъпва, когато потребителят премести показалеца на мишката извън хипервръзка.
г) събитието Load (onLoad)
Това събитие настъпва, когато една Web страница завърши зареждането си. Функцията се поставя в тага <BODY>.
д) събитието Unload (onUnload)
Това събитие настъпва, когато потребителят напусне Web страницата (при щракване върху хипервръзка, при изписване на нов адрес в браузъра или при затваряне на прозореца). Функцията се поставя в тага <BODY>.
е) събитието Focus (onFocus)
Събитието Focus настъпва, когато потребителят предаде фокуса на прозорец или елемент от формуляр в Web страница. Потребителят дава фокуса като щракне някъде върху елемента. Например, когато потребителят щракне някъде в текстово поле (преди да въведе нещо), той предава фокуса на текстовото поле. А ако щракне в неактивен прозорец, той го прави активен и му предава фокуса. Тази функция може да се използва в елемент от формуляр или в отварящия таг <BODY> (при предаване на фокуса към прозореца).

Пример:
<HTML>
<BODY>
<FORM> Въведете вашето име:
<INPUT type=”text” onFocus=”window.alert (‘Използвайте само главни букви!’);”>
</FORM>
</BODY>
</HTML>

ж) събитието Blur (onBlur)
Събитието настъпва, когато потребителят отнеме фокуса от даден елемент от форма или прозорец. За да отнеме фокуса на нещо, потребителят обикновено предава фокуса на друг елемент.
з) събитието Change (onChange)
Настъпва, когато потребителят промени нещо в рамките на даден елемент от формуляр.

Пример:
<HTML>
<BODY>
<FORM>Кой е любимият ви сезон?
<SELECT onChange=”window.alert (‘Променяте избора си!’);”>
<OPTION selected> зима </OPTION>
<OPTION> пролет </OPTION>
<OPTION> лято </OPTION>
<OPTION> есен </OPTION>
</SELECT>
</FORM>
</BODY>
</HTML>

и) събитието Submit (onSubmit)
Събитието настъпва, когато потребителят изпрати форма от web страница. Функцията onSubmit може да бъде извикана от отварящия FORM таг.

Пример:
<HTML>
<BODY>
<FORM onSubmit=”window.alert(‘Благодарим Ви!’);”>Как се казвате?<BR>
<INPUT type=”text” name=”thename”><BR>
<INPUT type=”submit”>
</FORM>
</BODY>
</HTML>

4. Други събития.
- Abort (onAbort) - Събитието настъпва, когато потребителят спре зареждането на изображение. Функцията onAbort може да се поставя в IMG тага на даден HTML документ.
- Dragdrop (onDragDrop) - Събитието настъпва, когато потребите-лят пусне файл в прозореца на браузъра. Функцията се поставя в BODY тага.
Пример: . Връщането на резултат false предотвратява опита на браузъра да отвори файла.
- Error (onError) – Събитието настъпва, когато се получи грешка при зареждането на страница или изображение. Функцията може да се използва в IMG тага или в отварящия BODY таг.
- Keydown (onKeyDown) – Събитието настъпва, когато потребителят натисне клавиш от клавиатурата. Функцията може да се постави в таг за текстова област или в отварящия BODY таг.
- Keypress (onKeyPress) – Събитието настъпва, когато потребителят задържи клавиш от клавиатурата. Функцията може да се постави в таг за текстова област или в отварящия BODY таг.
- Keyup (onKeyUp) – Събитието настъпва, когато потребителят отпусне клавиш от клавиатурата. Функцията може да се постави в таг за текстова област или в отварящия BODY таг.
- Mousedown (onMouseDown) – Събитието настъпва, когато потребителят натисне бутон на мишката, но преди завършване на щракането. Функцията може да се постави в рамките на връзка (котва) на web страница или в други области (като DIV тагове).
- Mouseup (onMouseUp) – Събитието настъпва, когато потребителят отпусне бутона на мишката. Функцията може да се постави в рамките на връзка (котва) на web страница или в други области (като DIV тагове).
- Mousemove (onMouseMove) – Събитието настъпва, когато потребителят премести курсорът на мишката. Функцията може да се постави в отварящия BODY таг или в други тагове (като DIV тагове).
- Move (onMove) – Събитието настъпва при преместване на прозореца. Функцията може да се използва в отварящия BODY таг.
- Reset (onReset) – Събитието настъпва, когато потребителят щракне върху Reset бутона на форма. Функцията се поставя в отварящият таг FORM.
- Resize (onResize) – Събитието настъпва при промяна в размера на прозореца. Функцията може да се използва в отварящия BODY таг.
- Select (onSelect) – Събитието настъпва, когато потребителят избере някакъв текст в рамките на текстово поле или текстова област от страницата. Функцията може да се постави в таг за текстов вход или в таг за текстова облас в HTML документ.

<< Предходна Следваща >>