рефераты конспекты курсовые дипломные лекции шпоры

Раздел Образование
/
Обработка событий на Web-странице

Реферат Курсовая Конспект

Выберите учебное заведение

Обработка событий на Web-странице

Обработка событий на Web-странице - раздел Образование, Тема: Обработка событий и изменение свойств объектов на Web-странице К Событиям На Web-Странице Относятся Как Действия Пользовател...

К событиям на Web-странице относятся как действия пользователя, связанные с работой с мышью и клавиатурой, так и действия браузера, связанные с загрузкой, выгрузкой Web-страниц и др.

JavaScript поддерживает следующие обработчики событий:

onMouseover - вызывается по событию Mouseover : наведение указателя мыши на объект;

onMouseout - вызывается по событию Mouseout: указатель мыши снимается с объекта:

onMousemove - вызывается по событию Mousemove: указатель мыши помещается на объект или двигается по объекту;

onClick - вызывается по событию Click: щелчок (нажатие левой клавиши мыши);

onDblclick - вызывается по событию Dblclick: двойной щелчок;

onContextmenu - вызывается по событию Contextmenu: нажатие правой клавиши мыши;

onKeydown - вызывается по событию Keydown: нажатие клавиши клавиатуры;

onKeypress - вызывается по событию Keypress: нажатие и удерживание клавиши клавиатуры;

onKeyup - вызывается по событию Keyup: отжатие клавиши клавиатуры;

onLoad - вызывается по событию Load: загрузка Web-страницы;

onUnload - вызывается по событию Unload: выгрузка Web-страницы;

onHelp - вызывается по событию Help: нажатие клавиши помощи F1;

onFocus - вызывается по событию Focus: установка фокуса поля (при щелчке мыши по полю);

onBlur - вызывается по событию Blur: снятие фокуса.

Для обработки события в языке JavaScript используется такая конструкция:

Обработчик события="действия по обработке события",

где Обработчик события - это один из перечисленных выше обработчиков событий; действия по обработке события - это или вызов функции, или встроенный фрагмент программы на JavaScript.

Эта конструкция помещается в тот тэг, параметры которого должны быть изменены при совершении события, связанного с работой мыши. Обработчики событий, связанных с нажатием клавиш клавиатуры или с работой браузера, помещаются в тэг <BODY>.

При обработке событий, касающихся клавиатуры, определить ASCII-код (точнее Unicode) нажатой или отжатой клавиши можно так:

event.keyCode.

Для определения самого символа используется следующий метод объекта String: String.fromCharCode(Unicode).

В примере № 1 показано применение двух функций - changeHeader() и restoreHeader().

Первая из нихх вызывается по наведению мыши на заголовок "ЗАГОЛОВОК ПАРАГРАФА" (тэг <H1 ID="hd"> со значением идентификатора, равным "hd") и изменяет некоторые его свойства: используя параметр HTML ALIGN выравнивает по центру экрана, используя свойство CSS - увеличивает в два раза размер, меняет цвет, жирность и наклон. Кроме того эта функция задает фон в виде рисунка, изменяя параметр BACKGROUND тэга <BODY>.

Вторая функция восстанавливает исходные свойства фона и заголовка при снятии с него указателя мыши.

Для того, чтобы сделать программу более компактной в функции restoreHeader() применяется оператор with.

Пример 1

<HTML>

<HEAD>

<TITLE>Изменение свойств объектов на Web-странице </TITLE>

n=9;

function changeHeader() // Изменение свойств H1

{

bod.background="back1.gif";

hd.align="center";

document.all("hd").style.color="#00F";

hd.style.fontSize=2*n+"mm";

hd.style.fontWeight="normal";

hd.style.fontStyle="italic";

}

function restoreHeader() // Восстановление свойств H1

{

bod.background="";

hd.align="left";

with (hd.style)

{

color="black";

fontSize="9mm";

fontWeight="bold";

fontStyle="normal";

}

</SCRIPT>

</HEAD>

<H1 ID="hd" onMouseover="changeHeader()"

onMouseout="restoreHeader()"> ЗАГОЛОВОК </H1>

</BODY>

</HTML>

Развернуть

Открыть в широком формате

– Конец работы –

Эта тема принадлежит разделу:

Тема: Обработка событий и изменение свойств объектов на Web-странице

Доступ к свойствам объектов на Web странице с помощью языка JavaScript... Обработка событий на Web странице...

Если Вам нужно дополнительный материал на эту тему, или Вы не нашли то, что искали, рекомендуем воспользоваться поиском по нашей базе работ: Обработка событий на Web-странице

Что будем делать с полученным материалом:

Если этот материал оказался полезным ля Вас, Вы можете сохранить его на свою страничку в социальных сетях:

Все темы данного раздела:

Доступ к свойствам объектов на Web-странице с помощью языка JavaScript
В соответствии с объектной моделью документа DOM (Document Object Model), которая поддерживается языком JavaScript, все объекты (тэги) Web-страницы помещены в коллекцию (набор) docu

Доступ к отмеченным объектам на Web-странице
В лабораторной работе 9 "Изменение свойств объектов на Web-странице" был рассмотрен способ доступа к объектам на Web-странице с помощью их идентификаторов. Этот метод прос

Организация движения объектов на Web-странице
Режим позиционирования объекта, т.е. помещения его на экран задается с помощью свойства CSS position, которое имеет следующие значения: static - положение объекта на экране