Реклама - здесь может быть Ваша реклама, которую увидят 4000+ человек в сутки. Хотите 1000 посетителей на свой сайт за 50 копеек?

Исследование W3C Модели событий

Третий параметр метода addEventListener() объекта EventTarget указывает, можно ли перехватить событие обработчиком события родительского объекта для данного целевого объекта.

Пример назначения целевого объекта и отправки объекта Event с помощью метода addEventListener() объекта EventTarget.

Этот параграф, внутри которого в SPAN заключен текст. Нажимайте сюда мыщью для просмотра возникающих событий.

Характеристики события:

Control Panel
всплытие запрещено:
всплытие запрещено:
всплытие разрешено:
всплытие разрешено:

Исходный код этого примера:

<style type="text/css">
td {text-align:center}
</style>
<script type="text/javascript">
// add event listeners
function addBubbleListener(elemID) {
   document.getElementById(elemID).addEventListener("click", reportEvent, false);
}
function addCaptureListener(elemID) {
   document.getElementById(elemID).addEventListener("click", reportEvent, true);
}
// remove event listeners
function removeBubbleListener(elemID)  {
   document.getElementById(elemID).removeEventListener("click", reportEvent, false);
}
function removeCaptureListener(elemID) {
   document.getElementById(elemID).removeEventListener("click", reportEvent, true);
}
// display details about any event heard
function reportEvent(evt) {
   var elem = (evt.target.nodeType == 3) ? evt.target.parentNode : evt.target;
   if (elem.id == "mySPAN") {
      var msg = "Event processed at " + evt.currentTarget.tagName + 
      " element (event phase = " + evt.eventPhase + ").\n";
      document.controls.output.value += msg;
   }
}
// clear the details textarea
function clearTextArea() {
   document.controls.output.value = "";
}
</script>
<body id="myBODY">

<h1>Исследование W3C Модели событий</h1>

<p>Третий параметр метода addEventListener() объекта EventTarget указывает, можно ли перехватить событие обработчиком события родительского объекта для данного целевого объекта.

<p>Пример назначения целевого объекта и отправки объекта Event с помощью метода addEventListener() объекта EventTarget.


<p id="myP"><div id="mySPAN" class=res><br>Этот параграф, внутри которого в SPAN заключен текст.
Нажимайте сюда мыщью для просмотра возникающих событий.<br></div></p>

<form name="controls" id="controls">
   <p>Характеристики события:&nbsp;<input type="button"
      value="Clear" onclick="clearTextArea()" /><br />
      <textarea name="output" cols="80" rows="6" wrap="virtual">
      </textarea></p>
   <table cellpadding="5" border="1">
      <caption style="font-weight:bold">Control Panel</caption>
      <tr style="background-color:#ffff99">
         <td rowspan="2">всплытие запрещено:</td>
         <td><input type="button" value="Добавить в BODY" onclick=
            "addBubbleListener('myBODY')" /></td>
         <td><input type="button" value="Удалить из BODY" onclick=
            "removeBubbleListener('myBODY')" /></td>
      </tr>
      <tr style="background-color:#ffff99">
         <td><input type="button" value="Добавить в P" onclick=
            "addBubbleListener('myP')" /></td>
         <td><input type="button" value="Удалить из P" onclick=
            "removeBubbleListener('myP')" /></td>
      </tr>
      <tr style="background-color:#ff9999">
         <td rowspan="2">всплытие разрешено:</td>
         <td><input type="button" value="Добавить в BODY" onclick=
            "addCaptureListener('myBODY')" /></td>
         <td><input type="button" value="Удалить из BODY" onclick=
            "removeCaptureListener('myBODY')" /></td>
      </tr>
      <tr style="background-color:#ff9999">
         <td><input type="button" value="Добавить в P" onclick=
            "addCaptureListener('myP')" /></td>
         <td><input type="button" value="Удалить из P" onclick=
            "removeCaptureListener('myP')" /></td>
      </tr>
   </table>
</form>
Скопировать в буфер

- В строительном магазине строймастер бензопила, лучшие бензопилы в Киеве.