Глава 7. События

Загрузка скриптов, картинок: события onload и onerror

Здравствуйте! В этом уроке я хотел бы рассказать о таких вещах как  загрузка картинок и скриптов и подробнее остановиться на событиях onload и onerror.  Браузер позволяет вам отслеживать  загрузку внешних скриптов и картинок и для этого вы можете использовать такие события.

  • onload — если загрузка прошла успешно
  • onerror — если произошла ошибка

Событие onload и onerror javascript

Прочитать больше

События клавиатуры: keyup, keydown, keypress

Здравствуйте!  В этой статье я хотел бы рассказать  о событиях  клавиатуры. Мы с  вами уже рассмотрели события мыши и вот теперь разберем события клавиатуры.

Здесь материала не так много,  как  с событиями мыши, но все же хватает. Основные события клавиатуры — это keydown и keypress.

События клавиатуры JavaScript

Прочитать больше

Прокрутка документа: событие scroll

Здравствуйте! Продолжаем разбираться с событиями в JavaScript и на очереди у нас событие scroll, которое происходит при прокрутке окна броузера.

Это событие  могут генерировать только прокручиваемые элементы или само окно window. Но зато оно генерируется всегда, при любой прокрутке, не обязательно  если вы прокручиваете документ колесиком мыши.

Событие scroll

Прочитать больше

Мышь: Drag’n’Drop расширенные возможности

Здравствуйте!  В прошлой статье мы рассмотрели основы Drag’n’Drop.  В этой статье я хотел бы  разобрать дополнительные приёмы реализации, которые  могут возникать на практике.

Надо сказать, что почти все javascript-библиотеки реализуют Drag’n’Drop так, как написано.

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

Данный материал предназначен в первую очередь для усвоения  основ drag’n’drop.

drag'n'drop расширенные возможности

Прочитать больше

Мышь: Drag’n’Drop или перетаскивание элементов на веб-странице

Здравствуйте!  В этом уроке в продолжении темы события мыши мы с вами рассмотрим такое  событие как Drag’n’Drop – это  такая возможность захватить мышью элемент и перенести его на странице. В свое время это было  открытием в области интерфейсов, которое  упрощало  большое количество операций.

Напомню также, что мы с вами уже рассмотрели события мыши клики,  события мыши отмена выделения и события мыши mouseover/out, mouseenter/leave

Перенос мышкой может заменить  последовательность кликов. И,  конечно самое главное, он упрощает внешний вид интерфейса: функции, получаемые через Drag’n’Drop, в противном случае потребовали бы дополнительных полей.

Прочитать больше

События мыши: mouseover/out, mouseenter/leave

Здравствуйте!  В этом уроке мы продолжим разбираться с  событиями мыши и рассмотрим события, которые  возникают при движении мыши mouseover, mouseenter.

Эти события  возбуждаются, когда пользователь двигает мышью или наводит мышь (mouseover), уводит (mouseout) от элемента на веб-странице.

События мыши mouseover, mouseout

Прочитать больше

События мыши: отмена выделения

Здравствуйте! В продолжении темы «События мыши»  сегодня  я хочу поговорить об отмене выделения текста, когда пользователь 2 раза кликает на текст.  Дело в том, что у кликов мыши есть  одна неприятная особенность.

2-ой клик или нажатие с движением курсора приводят к  выделению текста.

Если вы  желаете  обрабатывать эти все  события сами, то такое выделение –  конечно некрасиво и неудобно. В этом уроке  мы с вами  разберем основные способы, как сделать элемент, чтобы он не выделялся.

 

события мыши. Отмена выделения текста

Прочитать больше

События мыши: клики, кнопка, координаты

Здравствуйте! В этой статье в продолжении темы «События в JavaScript»  я хотел бы  мы глубже разобраться со списком событий мыши, рассмотреть их общие свойства, а также те события, которые связаны с кликом мыши.  Ведь когда пользователь кликает на каком то элементе, то на самом деле происходят 2 события mousedown и mouseup.  Ну и также еще имеется ряд нюансов при работе с мышью.

события мыши: клики, координаты

Прочитать больше

Отмена действий браузера по умолчанию

Здравствуйте! В этом уроке я хотел бы рассмотреть такой вопрос, как отмена действий браузера по умолчанию. Дело в том, что  есть некоторые события в браузере за которыми уже закреплены стандартные обработчики и вот они могут срабатывать  вместе с вашими обработчиками, а как сделать так, чтобы эти обработчики по умолчанию не срабатывали. Вот об этом и читайте дальше.

Перечислю основные события браузера по умолчанию:

  • Клик по ссылке  — вы переходите на новую страницу, адрес которой указан в атрибуте href.
  • Нажатие на кнопку «отправить» в форме –   отсылает данные формы на сервер.
  • Двойной клик на тексте –  при этом текст будет выделен.

Так вот, когда вы обрабатывает какое-то из этих событий, то зачастую вам не требуется срабатывание  обработчиков, закрепленных за этими событиями.  Давайте рассмотри как  их отменить можно.


Прочитать больше

Делегирование событий в JavaScript

Здравствуйте! Всплытие событий, которое мы с вами рассматривали в прошлом уроке  позволяет реализовать один из самых я бы сказал  важных приёмов разработки – делегирование.

Делегирование заключается в том, что если у вас есть очень много элементов, события на которых нужно обрабатывать одним и тем же  образом, то вместо того, чтобы назначать обработчик каждому –  вы можете установить один обработчик на их общего родителя. Из него вы  можете получить  элемент event.target, чтобы понять на каком именно потомке произошло событие и соответственно  обработать его.

Делегирование событий JavaScript

Прочитать больше

Сообщить об опечатке

Текст, который будет отправлен нашим редакторам: