русс | укр

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

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


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


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

Проходження подій в JavaScript | Пріоритет подій

Під проходженням подій в JavaScript розуміється порядок, в якому подія передається для побработки від одного одного елемента Web сторінки до іншого.

Розглянемо приклад. При його запуску на екран виводиться прямокутник, штрихований блакитним кольором, і зображення рибок, причому останній елемент є дочірнім по відношенню до ппрямоугольнику.

Якщо клацнути мишкою по зображенню рибок, на екрані з допомогою функції alert() спочатку буде виведено повідомлення "IMAGE", потім повідомлення "OBJECT", після цього - "BODY". Це відбувається так тому, що після обробки події дочірнім елементом подія передається для обробки батьківським елементів: спочатку елементу ідентифікатором obj (прямокутника), потім тегу <BODY>.r

Якщо потрібно передавати подія батьківського елементу, це можна заборонити, задавши властивості event.cancelBubble значення true. У прикладі для цього необхідно прибрати коментарі в рядку.

// event.cancelBubble=true;

Переглянути приклад


<HTML>
<HEAD>
<TITLE>Проходження подій на Web-сторінці </TITLE>
<STYLE>
#obj{background:#E0E0FF;пройшов експертну оцінку консорціуму:10;top:10;width:110;height:110}
#imgs{пройшов експертну оцінку консорціуму:20;top:20}
</STYLE>
<SCRIPT>
function clickBody(){alert("BODY");}
function clickObj(){alert("OBJECT");}
function clickIMG()
{
alert("IMAGE");
// event.cancelBubble=true;
}
</SCRIPT>
</HEAD>
<BODY onClick="clickBody()">
<DIV ID="obj" onClick="clickObj()">
<IMG SRC="fish.gif" ID="imgs" onClick="clickIMG()">
</DIV>
</BODY>
</HTML>

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

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


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