Приветствую Вас, Гость! Регистрация RSS

Программируем просто

Четверг, 18.06.2026
Главная » 2012 » Май » 7 » Объект event в JavaScript | Event window
14:10
Объект event в JavaScript | Event window

Часто вместе с событием передаются данные, связанные с этим событием, например, при щелчке мышки по элементу Web-страницы передается указатель на этот элемент. Для того, чтобы программа могла получить доступ к этим данным, в JavaScript предусмотрен объект event, который является свойством объекта window. Тогда данные, которые передаются вместе с событием можно получить с помощью выражения window.event.свойство.

Приведем некоторые свойства объекта event:

  • srcElement - возвращает ссылку на элемент (тэг) Web-страницы, вызвавший наступление события;
  • fromElement - возвращает ссылку на элемент Web-страницы, с которого переместился курсор мышки при наступлении события Mouseover или Mouseout;
  • toElement - возвращает ссылку на элемент Web-страницы, на который помещен курсор мышки;
  • type - возвращает имя события;
  • returnValue - задает, будет ли выполняться действие по умолчанию (если true - будет, если false - нет);
  • propertyValue - возвращает имя атрибута тэга или стиля свойства элемента Web-страницы, значение которого изменилось;
  • button - возвращает номер нажатой кнопки мышки:
    • 0 - ничего не было нажато;
    • 1 - нажата левая кнопка;
    • 2 - нажата правая кнопка;
    • 3 - нажаты одновременно левая и правая кнопки;
    • 4 - нажата средняя кнопка;
    • 5 - нажаты одновременно левая и средняя кнопки;
    • 6 - нажаты одновременно правая и средняя кнопки;
    • 7 - нажаты одновременно все кнопки.

Пример использования свойсва type и srcElement объекта event в JavaScript:

<HTML>
<HEAD>
<TITLE>Определение свойств объектов </TITLE>
<STYLE>P{color:#0000D0;font-size:8mm}</STYLE>
<SCRIPT>
function allTags()
{
tags="Web-страница содержит следующие тэги: ";
for (i=0; i<document.all.length; i++)
with (document.all.item(i)) // Метод item() не обязателен
{
tags+="\n"+i+" "+tagName+" "+id;
if (tagName!="BODY"&&tagName!="HTML")
tags+=" "+innerText;
if (tagName!="HTML") tags+=" "+parentElement.tagName;
}
alert(tags);
}
function showTagInfo()
{
with (event.srcElement)
{
window.status="Номер: "+sourceIndex+
" имя: "+tagName+
" цвет: " + currentStyle.color +
" размер: " + currentStyle.fontSize+
" жирность: "+currentStyle.fontWeight+
}
}
function changeTags()
{
tagsP=document.getElementsByTagName("P")
for(i=0;i<tagsP.length;i++)
{
size=parseInt(tagsP[i].currentStyle.fontSize);
tagsP[i].runtimeStyle.fontSize=size*1.25+"mm";
}
}
</SCRIPT>
</HEAD>
<BODY ID="bod" ALIGN=center
onLoad="allTags()"
onClick="showTagInfo()"
onDblclick="changeTags()">
<H1 ID="h1" ALIGN=center
STYLE="color:#FF00FF; font:12mm"> Заголовок </H1>
<P id="p1" STYLE="color:blue; font-size:4mm"> Текст
<FONT ID="f" COLOR=#C00000 SIZE=5> Еще текст
</FONT></P>
<P ID="p2"><B ID="bb"> Полужирный </B> текст </P>
</BODY>
</HTML>

Результат работы можна просмотреть здесь.

Категория: Java/ Javascript/ jQuery | Просмотров: 621 | Добавил: Ne0Lite