СПРАВОЧНИК

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

• srcElement.tagName — имя тега
• srcElement.type значение атрибута type
• srcElement.value — значение атрибута value

<FORM>
<INPUT type=button value="Свойства источника события"
  onclick='alert("tagName="+event.srcElement.tagName+
                 "\ntype="+event.srcElement.type+
                 "\nvalue="+event.srcElement.value)'>
</FORM>

Щелкните по этой картинке, и вы увидите в отдельном окне браузера все свойства источника этого события (щелчка по картинке).

Строка, содержащая тип события.

<FORM>
<INPUT type="button" value="type"
       onclick="alert(event.type)">
</FORM>

<FORM>
<INPUT type="text" value="Измени этот текст"
       onChange="alert(event.type)">
</FORM>

Координаты события относительно начала окна, в котором браузер показывает документ.

<IMG src=pic/explorer.gif width=125 height=82 border=1 alt=Испытатель onClick="alert(event.clientX+','+event.clientY)">

Щелкните по этой картинке в разных ее местах.

Координаты события относительно начала экрана монитора.

<IMG src=pic/explorer.gif width=125 height=82 border=1 alt=Испытатель onClick="alert(event.screenX+','+event.screenY)">

Щелкните по этой картинке в разных ее местах.

Координаты события относительно тега, на котором произошло событие.

<IMG src=pic/explorer.gif width=125 height=82 border=1 alt=Испытатель onClick="alert(event.offsetX+','+event.offsetY)">

Щелкните по этой картинке в разных ее местах.

Координаты события относительно начала документа в окне, в котором браузер показывает документ. Начало документа может быть существенно “выше” верхней границы окна и “левее” его левой границы, если работают линейки протяжки.

<IMG src=pic/explorer.gif width=125 height=82 border=1 alt=Испытатель onClick="alert(event.x+','+event.y)">

Щелкните по этой картинке в разных ее местах.

Число, указывающее нажатую кнопку мыши.

<FORM>
<INPUT type="button" value="button"
       onMouseDown="alert(event.button)">
</FORM>

Код нажатой клавиши.

<FORM>
  <INPUT type="button" value="keyCode"
     onKeyPress="this.form.code.value=event.keyCode">
  <INPUT name="code" type="text" value="" size="10">
</FORM>

Код нажатой клавиши.

<FORM>
 <INPUT type=button value="Спецклавиши"
   onKeyDown="this.form.Alt.value=event.altKey;
              this.form.Ctrl.value=event.ctrlKey;
              this.form.Shift.value=event.shiftKey;"
   onKeyUp  ="this.form.Alt.value='';
              this.form.Ctrl.value='';
              this.form.Shift.value='';">
 Alt<INPUT name=Alt type=text value="" size=7>
 Ctrl<INPUT name=Ctrl type=text value="" size=7>
 Shift<INPUT name=Shift type=text value="" size=7>
</FORM>

Элемент, находящийся под курсором мыши, и элемент, вышедший из под курсора мыши. Эти свойства являются объектами и сами содержат различные свойства (информацию об элементах), среди которых:

• tagName — имя тега
• name — значение соответствующего атрибута

<UL onMouseOver=
    "document.forma.t.value=event.toElement.name;
     document.forma.f.value=event.fromElement.name;"
    onMouseOut=
    "document.forma.t.value='';
     document.forma.f.value=''">
  <LI name=item1>Первый элемент списка ("item1")
  <LI name=item2>Второй элемент списка ("item2")
  <LI name=item3>Третий элемент списка ("item3")
</UL>
<FORM name="forma">
 To:<INPUT name=t type=text value="" size=12>
 From:<INPUT name=f type=text value="" size=12>
</FORM>

Позволяет запретить или разрешить действие, предписанное элементу.

<A href="event01.htm"
   onClick="event.returnValue=confirm('Перейти?')"
>Переход на другой документ</A>