русс | укр

Мови програмуванняВідео уроки php mysqlПаскальСіАсемблерJavaMatlabPhpHtmlJavaScriptCSSC#DelphiТурбо Пролог

Компьютерные сетиСистемное программное обеспечениеИнформационные технологииПрограммирование


Linux Unix Алгоритмічні мови Архітектура мікроконтролерів Введення в розробку розподілених інформаційних систем Дискретна математика Інформаційне обслуговування користувачів Інформація та моделювання в управлінні виробництвом Комп'ютерна графіка Лекції


Шановні українці! Матеріал був перекладений з російської мови. Тому можуть бути незначні помикли...

Об'єкт event в JavaScript | Event window

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

Наведемо деякі властивості об'єкта event:

  • srcElement - повертає посилання на елемент (тег) web-сторінки, викликав настання події;
  • fromElement - повертає посилання на елемент Web-сторінки, з якого перемістився курсор мишки при настанні події Mouseover чи Mouseout;
  • toElement - повертає посилання на елемент Web-сторінки, на який розміщено курсор мишки;
  • type - повертає назву події;
  • returnValue - вказує, чи виконуватиметься дія замовчуванням (якщо так буде, якщо 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>

Результат роботи можна переглянути тут.

Переглядів: 4747

Повернутися взміст


Онлайн система числення Калькулятор онлайн звичайний Науковий калькулятор онлайн