В данном разделе содержатся уроки по Javascript. Они рассчитаны на тех кто хорошо знаком с HTML и CSS и помогут вам сделать ваши сайты адаптивными и динамичными. Все уроки представлены с примерами которые можно посмотреть в отдельном окне, также имеются задания к урокам.
События мыши: отмена выделения
Здравствуйте! В продолжении темы «События мыши» сегодня я хочу поговорить об отмене выделения текста, когда пользователь 2 раза кликает на текст. Дело в том, что у кликов мыши есть одна неприятная особенность.
2-ой клик или нажатие с движением курсора приводят к выделению текста.
Если вы желаете обрабатывать эти все события сами, то такое выделение – конечно некрасиво и неудобно. В этом уроке мы с вами разберем основные способы, как сделать элемент, чтобы он не выделялся.
События мыши: клики, кнопка, координаты
Здравствуйте! В этой статье в продолжении темы «События в JavaScript» я хотел бы мы глубже разобраться со списком событий мыши, рассмотреть их общие свойства, а также те события, которые связаны с кликом мыши. Ведь когда пользователь кликает на каком то элементе, то на самом деле происходят 2 события mousedown и mouseup. Ну и также еще имеется ряд нюансов при работе с мышью.
Отмена действий браузера по умолчанию
Здравствуйте! В этом уроке я хотел бы рассмотреть такой вопрос, как отмена действий браузера по умолчанию. Дело в том, что есть некоторые события в браузере за которыми уже закреплены стандартные обработчики и вот они могут срабатывать вместе с вашими обработчиками, а как сделать так, чтобы эти обработчики по умолчанию не срабатывали. Вот об этом и читайте дальше.
Перечислю основные события браузера по умолчанию:
- Клик по ссылке — вы переходите на новую страницу, адрес которой указан в атрибуте href.
- Нажатие на кнопку «отправить» в форме – отсылает данные формы на сервер.
- Двойной клик на тексте – при этом текст будет выделен.
Так вот, когда вы обрабатывает какое-то из этих событий, то зачастую вам не требуется срабатывание обработчиков, закрепленных за этими событиями. Давайте рассмотри как их отменить можно.
Делегирование событий в JavaScript
Здравствуйте! Всплытие событий, которое мы с вами рассматривали в прошлом уроке позволяет реализовать один из самых я бы сказал важных приёмов разработки – делегирование.
Делегирование заключается в том, что если у вас есть очень много элементов, события на которых нужно обрабатывать одним и тем же образом, то вместо того, чтобы назначать обработчик каждому – вы можете установить один обработчик на их общего родителя. Из него вы можете получить элемент event.target, чтобы понять на каком именно потомке произошло событие и соответственно обработать его.
Всплытие и перехват событий
Здравствуйте! В этом уроке я хочу рассказать о таком важном понятии как всплытие и перехват событий. Всплытие это такое явление при котором, если вы щелкаете по дочернему элементу, то событие распространяется и на его родитель.
Бывает очень полезно при обработке больших вложенных списков или таблиц, чтобы не назначать каждому элементу обработчик события можно назначить один обработчик на родительский элемент, а событие уже будет распространяться на все вложенные элементы в родитель. Давайте рассмотрим на примере.
Этот обработчик для <div> сработает, если вы кликните по вложенному тегу <em> или <code>:
<div onclick="alert('Обработчик на Div сработал!')">
<em>Кликните на EM, сработает обработчик на DIV</em>
</div>
Как видите при клике на вложенном элементе em срабатывает обработчик на div. Почему так происходит? Читайте дальше и узнаете.
Объект события Event
Здравствуйте! Продолжаем разбираться с событиями в JavaScript и на очереди у нас собственно объект события (Event). Как правило при обработке события браузер может автоматически передать в функцию обработчика события в качестве параметра некий объект Event, который содержит всю информацию о событии. И с помощью свойств этого объекта мы с вами можем получить эту информацию.
Введение в события JavaScript
Здравствуйте! Рассмотрев тему «Работа с DOM в JavaScript», перейдем непосредственно к теме «События в Javascript». Надо сказать, что данная тема является чуть ли не основной для обработки сценариев в браузере. События нужны, чтобы реагировать на действие пользователя при взаимодействии со страницей.
Событие — это своего рода сигнал браузера о том, что что-то произошло. Событий существует очень много мы же с вами рассмотрим лишь только основные события.
Отладка скриптов в браузере Chrome
Здравствуйте! В продолжении темы обработки ошибок в JavaScript поговорим об отладке скриптов силами браузера. Для примера возьмем самый лучший браузер на Земле — Chrome.
В принципе такие инструменты есть в любом браузере, а если учесть, что большая часть браузеров работает на одном движке, что и Chrome, то тут в принципе не будет особых различий. Также еще очень хорош Firefox со своим инструментом Firebug.
Перехват ошибок в JavaScript, «try..catch»
Здравствуйте! В этом уроке я хотел бы рассказать об ошибках в JavaScript и о том как их собственно обрабатывать. Ведь часто случается, что ошибки происходят время от времени и тут даже дело не в наличие опыта программирования или даже полном его отсутствии. Ведь и у матерых программистов тоже случаются ошибки никто от этого не застрахован.
Ошибки бывают в основном 2-х типов — это синтаксические и логические. К синтаксическим можно отнести ошибки в имени переменных, функций, ошибки в синтаксисе кода. В принципе такие ошибки легко отловить через консоль браузера.
А вот логические ошибки с ними все не так просто потому, что они приводят к неправильному выполнению кода программы. Поэтому для их устранения потребуется отладка программы, чтобы понять что собственно происходит на каждом шаге скрипта. Мы же с вами здесь рассмотрим в основном локализацию синтаксических ошибок с помощью конструкции try…catch.
Прочитать больше
Таймеры в JavaScript
Здравствуйе! В этом уроке я расскажу о таком понятии как таймеры в JavaScript. Тут надо заметить, что в JavaScript имеется так называемый внутренний таймер-планировщик, который и позволяет задавать вызов любой функции через определенный период времени. Вот эти-то функции мы с вами и рассмотрим в этом уроке.
Сообщить об опечатке
Текст, который будет отправлен нашим редакторам: