Что такое preventdefault в js
На этом уроке мы рассмотрим, как можно отменить стандартные действия браузера, которые происходят, когда пользователь взаимодействует с некоторыми элементами веб-страницы. Также узнаем как отмена стандартного действия, которое выполняет браузер, влияет не его всплытие.
Действия браузера по умолчанию
Имеется много различных событий, при наступлении которых браузер выполняет определённые стандартные действия:
Отмена стандартного действия браузера
Отмена стандартного действия браузера осуществляется посредством вызова метода preventDefault в обработчике события.
Возможность отменять стандартные действия браузера очень часто применяются перед отправкой формы на сервер. Она используется для того чтобы проверить правильность заполнения формы с помощью скриптов JavaScript.
Влияет ли отмена стандартного действия, которое выполняет браузер, на его всплытие
В этом разделе мы рассмотрим следующий вопрос: «Влияет ли на всплытие события то, что мы отменили выполнение стандартного действия браузера, которое с ним связано?»
Чтобы разобраться в этом вопросе, давайте рассмотрим следующий пример:
Следовательно, отмена стандартного действия браузера для некоторого события не влияет на всплытие пузырька (события), т.е. они выполняются не зависимо друг от друга
В ситуациях, когда Вам необходимо отменить стандартное действие браузера и всплытие события (пузырька), можно использовать следующий код:
Генерация пользовательских событий
Можно не только назначать обработчики, но и генерировать события из JavaScript-кода.
Пользовательские события могут быть использованы при создании графических компонентов. Например, корневой элемент нашего меню, реализованного при помощи JavaScript, может генерировать события, относящиеся к этому меню: open (меню раскрыто), select (выбран пункт меню) и т.п. А другой код может слушать эти события и узнавать, что происходит с меню.
Конструктор Event
Встроенные классы для событий формируют иерархию аналогично классам для DOM-элементов. Её корнем является встроенный класс Event.
Событие встроенного класса Event можно создать так:
По умолчанию все три свойства установлены в false:
Метод dispatchEvent
В примере ниже событие click инициируется JavaScript-кодом так, как будто кликнули по кнопке:
Можно легко отличить «настоящее» событие от сгенерированного кодом.
Свойство event.isTrusted принимает значение true для событий, порождаемых реальными действиями пользователя, и false для генерируемых кодом.
Пример всплытия
Всё, что нужно сделать – это установить флаг bubbles в true :
Механизм всплытия идентичен как для встроенного события ( click ), так и для пользовательского события ( hello ). Также одинакова работа фаз всплытия и погружения.
MouseEvent, KeyboardEvent и другие
Для некоторых конкретных типов событий есть свои специфические конструкторы. Вот небольшой список конструкторов для различных событий пользовательского интерфейса, которые можно найти в спецификации UI Event:
Специфический конструктор позволяет указать стандартные свойства для данного типа события.
Например, clientX/clientY для события мыши:
Полный список свойств по типам событий вы найдёте в спецификации, например, MouseEvent.
Пользовательские события
Свойство detail может содержать любые данные. Надо сказать, что никто не мешает и в обычное new Event записать любые свойства. Но CustomEvent предоставляет специальное поле detail во избежание конфликтов с другими свойствами события.
event.preventDefault()
Для многих браузерных событий есть «действия по умолчанию», такие как переход по ссылке, выделение и т.п.
Для новых, пользовательских событий браузерных действий, конечно, нет, но код, который генерирует такое событие, может предусматривать какие-то свои действия после события.
Вызов event.preventDefault() является возможностью для обработчика события сообщить в сгенерировавший событие код, что эти действия надо отменить.
Посмотрим практический пример – прячущегося кролика (могло бы быть скрывающееся меню или что-то ещё).
Вложенные события обрабатываются синхронно
Исключением является ситуация, когда событие инициировано из обработчика другого события.
Тогда управление сначала переходит в обработчик вложенного события и уже после этого возвращается назад.
В примере ниже событие menu-open обрабатывается синхронно во время обработки onclick :
Порядок вывода: 1 → вложенное событие → 2.
Новый порядок вывода: 1 → 2 → вложенное событие.
Итого
Чтобы сгенерировать событие из кода, вначале надо создать объект события.
Базовый конструктор Event(name, options) принимает обязательное имя события и options – объект с двумя свойствами:
Весьма часто, когда разработчик хочет сгенерировать встроенное событие – это вызвано «кривой» архитектурой кода.
Как правило, генерация встроенных событий полезна в следующих случаях:
Пользовательские события со своими именами часто создают для улучшения архитектуры, чтобы сообщить о том, что происходит внутри наших меню, слайдеров, каруселей и т.д.
Действия браузера по умолчанию
Многие события автоматически влекут за собой действие браузера.
Если мы обрабатываем событие в JavaScript, то зачастую такое действие браузера нам не нужно. К счастью, его можно отменить.
Отмена действия браузера
Есть два способа отменить действие браузера:
В следующем примере при клике по ссылке переход не произойдёт:
Обычно значение, которое возвращает обработчик события, игнорируется.
В других случаях return не нужен, он никак не обрабатывается.
Пример: меню
Рассмотрим меню для сайта, например:
Данный пример при помощи CSS может выглядеть так:
Кстати, использование здесь делегирования событий делает наше меню очень гибким. Мы можем добавить вложенные списки и стилизовать их с помощью CSS – обработчик не потребует изменений.
Некоторые события естественным образом вытекают друг из друга. Если мы отменим первое событие, то последующие не возникнут.
Опция «passive» для обработчика
Почему это может быть полезно?
Есть некоторые события, как touchmove на мобильных устройствах (когда пользователь перемещает палец по экрану), которое по умолчанию начинает прокрутку, но мы можем отменить это действие, используя preventDefault() в обработчике.
Поэтому, когда браузер обнаружит такое событие, он должен для начала запустить все обработчики и после, если preventDefault не вызывается нигде, он может начать прокрутку. Это может вызвать ненужные задержки в пользовательском интерфейсе.
Опция passive: true сообщает браузеру, что обработчик не собирается отменять прокрутку. Тогда браузер начинает её немедленно, обеспечивая максимально плавный интерфейс, параллельно обрабатывая событие.
event.defaultPrevented
Рассмотрим практическое применение этого свойства для улучшения архитектуры.
Помните, в главе Всплытие и погружение мы говорили о event.stopPropagation() и упоминали, что останавливать «всплытие» – плохо?
Давайте посмотрим практический пример.
По умолчанию браузер при событии contextmenu (клик правой кнопкой мыши) показывает контекстное меню со стандартными опциями. Мы можем отменить событие по умолчанию и показать своё меню, как здесь:
Теперь в дополнение к этому контекстному меню реализуем контекстное меню для всего документа.
При правом клике должно показываться ближайшее контекстное меню.
Как это поправить? Одно из решений – это подумать: «Когда мы обрабатываем правый клик в обработчике на кнопке, остановим всплытие», и вызвать event.stopPropagation() :
Теперь контекстное меню для кнопки работает как задумано. Но цена слишком высока. Мы навсегда запретили доступ к информации о правых кликах для любого внешнего кода, включая счётчики, которые могли бы собирать статистику, и т.п. Это слегка неразумно.
Как мы можем видеть, event.stopPropagation() и event.preventDefault() (также известный как return false ) – это две разные функции. Они никак не связаны друг с другом.
Есть также несколько альтернативных путей, чтобы реализовать вложенные контекстные меню. Одним из них является единый глобальный объект с обработчиком document.oncontextmenu и методами, позволяющими хранить в нём другие обработчики.
Объект будет перехватывать любой клик правой кнопкой мыши, просматривать сохранённые обработчики и запускать соответствующий.
Итого
Действий браузера по умолчанию достаточно много:
Все эти действия можно отменить, если мы хотим обработать событие исключительно при помощи JavaScript.
Технически, отменяя действия браузера по умолчанию и добавляя JavaScript, мы можем настроить поведение любого элемента. Например, мы можем заставить ссылку работать как кнопку, а кнопку вести себя как ссылка (перенаправлять на другой URL).
Но нам следует сохранять семантическое значение HTML элементов. Например, не кнопки, а тег должен применяться для переходов по ссылкам.
Помимо того, что это «хорошо», это делает ваш HTML лучше с точки зрения доступности для людей с ограниченными возможностями и с особых устройств.
Форум
Discord чат
Введение в события
Практически все JavaScript-приложения выполняют те или иные действия, откликаясь на различные события.
Есть множество самых различных событий.
Именно DOM-события связывают действия, происходящие в документе, с кодом JavaScript, тем самым обеспечивая динамический веб-интерфейс.
Назначение обработчиков
Существует несколько способов назначать обработчик на конкретное событие элемента. Все они представлены ниже.
Через атрибут HTML-тега
Этот код в действии:
Можно назначить и функцию.
Но если вы хотите придерживаться хорошего стиля (или спецификации XHTML), то имена тегов и их атрибуты должны быть указаны в нижнем регистре.
Когда использовать
Впрочем, сколько-нибудь сложные обработчики в HTML никто не пишет. Вместо этого лучше устанавливать обработчики из JavaScript способами, которые будут представлены ниже.
Через свойство объекта
Вот пример установки обработчика события click на элемент с id=»myElement» :
Этот код в действии:
Стоит сразу обратить внимание на две детали:
В этом смысле эти два кода работают одинаково:
Иначе узел просто не будет найден.
Конечно, можно и не создавать анонимную функцию, а использовать любую уже готовую:
Когда использовать
Конечно, можно при назначении нового обработчика копировать предыдущий и запускать его самостоятельно. Но лучше использовать специальные методы назначения.
Специальные методы
Представленных выше методов недостаточно для случаев, которые возникают при разработке серьёзного JavaScript-приложения.
Существует два основных интерфейса для установки событий.
Решение Microsoft
Методы, предложенные Microsoft, работают только в браузерах Internet Explorer и Opera(она поддерживает метод Microsoft для лучшей совместимости).
Так было бы неправильно:
Как уже говорилось ранее, вы можете установить несколько обработчиков на одно событие одного элемента:
Этот код в действии (будет работать только в Internet Explorer/Opera):
Установка по стандарту W3C
Решение W3C работает во всех современных браузерах, кроме Internet Explorer.
Обратите внимание, что имя события указывается без префикса «on».
Как и в других случаях, вы должны передать имя обработчика не ставя круглых скобок, иначе функция будет выполнена сразу, а в качестве обработчика будет передан лишь её результат.
Далее мы вернемся к различным способам установки обработчиков и в подробностях рассмотрим, как сделать все кросс-браузерно.
Объект «событие» ( event )
Объект событие всегда передается обработчику и содержит массу полезной информации о том где и какое событие произошло.
Способов передачи этого объекта обработчику существует ровно два, и они зависят от способа его установки и от браузера.
В браузерах, работающих по рекомендациям W3C, объект события всегда передается в обработчик первым параметром.
При вызове обработчика объект события event будет передан ему первым аргументом.
Можно назначить и вот так:
Internet Explorer
То есть, все должно работать так:
Обратите внимание, что доступ к event при назначении обработчика в HTML (см. пример выше) по-прежнему будет работать. Такой вот надежный и простой кросс-браузерный доступ к объекту события.
Кросс-браузерное решение
Можно кросс-браузерно получить объект события, использовав такой приём:
Получение события при inline-записи
Этот код в действии:
Что дает объект события?
Из объекта события обработчик может узнать, на каком элементе оно произошло, каковы были координаты мыши (для событий, связанных с мышью), какая клавиша была нажата (для событий, связанных с клавиатурой), и извлечь другую полезную информацию.
Например, для события по клику мыши ( onclick ), свойство event.target (в IE event.srcElement ) содержит DOM-элемент, на котором этот клик произошел.
Более подробно это описано в следующей статье Свойства объекта событие.
Порядок срабатывания событий
Примечательно, что на одно событие может реагировать не только тот элемент, на котором произошло событие, но и элементы над ним.
Рассмотрим ситуацию, когда у вас есть три элемента «вложенных» друг в друга.
Всего существует 2 модели поведения, они не имеют преимуществ между собой, но используют принципиально разные подходы. Стандарт W3C объединяет две модели в одну универсальную.
Всплывающие события (Bubbling)
В этой модели сначала будет выполнен обработчик на элементе 3, затем на элементе 2, и последним будет выполнен обработчик на элементе 1.
Такой порядок называется «всплывающим», потому что событие поднимается с самых «глубоких» элементов в представлении DOM, к самым «верхним», как пузырек воздуха в воде.
Визуально это выглядит так (кликните на вложенном элементе, чтоб увидеть, какой будет порядок обработки события):
Остановка всплытия
Нужно понимать, что «всплытие» происходит всегда. При возникновении события на элементе, сигнал будет подниматься до самого высокого элемента, выполняя нужные обработчики.
Можно уложить блок if/else в одну строчку:
Перехват событий (Capturing)
Визуально это выглядит так (кликните на вложенном элементе, чтоб увидеть, какой будет порядок обработки события, не поддерживается в IE):
Такой порядок был предложен Netscape и никогда не поддерживался в Internet Explorer, поэтому в IE вы не сможете увидеть этот пример в действии.
Остальные браузеры поддерживают одновременно такой порядок и порядок всплытия, но из-за проблем с Internet Explorer де-факто его почти никто не использует.
Порядок обработки в стандарте W3C
Решение от W3C объединяет обе модели: перехват и всплытие в одну универсальную.
При совершении действия, сначала событие перехватывается, пока не достигнет конечного элемента, затем всплывает.
Таким образом, разработчик сам решает, когда должен срабатывать обработчик события – при перехвате или при всплытии.
Визуально это выглядит так (кликните на вложенном элементе, чтоб увидеть, какой будет порядок обработки события, не для IE):
При установке обработчиков классическими методами (через свойство элемента или атрибут html тега) события всегда будут срабатывать на фазе всплытия.
Дальше мы вообще не будем рассматривать фазу захвата, так как в реальной жизни используется только всплытие.
Действие браузера по умолчанию
Браузер имеет своё собственное поведение по умолчанию для различных событий.
В ряде случаев реакцию браузера на событие можно убрать в обработчике.Для этого у IE и W3C есть, как и раньше, два по сути близких, но по виду разных способа:
Вместо if/else можно записать одну строчку:
Некоторые поведения по умолчанию происходят до вызова обработчика события. В этом случае их, конечно же, отменить нельзя.
А переход по ссылке выполняется после события, поэтому его отменить можно.
Обработчики onfocus и onclick на этой ссылке отменяют поведение по умолчанию:
При клике перехода не произойдет, а рамка вокруг ссылки появится.
Смысл return false из обработчика
Возвращение return false из обработчика события предотвращает действие браузера по умолчанию, но не останавливает всплытие. В этом смысле следующие два кода эквивалентны:
Заметим, что хотя даже если всплытие и действия по умолчанию остановлены, но другие обработчики на текущем элементе все равно сработают.
Действительно, браузер даже не гарантирует порядок, в котором сработают обработчики на одном элементе. Назначить можно в одном порядке, а сработают в другом.
Поэтому тем более один обработчик никак не может влиять на другие того же типа на том же элементе.
Резюме
В следующих статьях мы разберем, какие свойства есть у объекта события, как их кроссбраузерно обрабатывать и назначать обработчики.
Спасибо за статью.
Эта часть наверное самая важная для понимания javascript
Полностью согласен, давно ждал подобной статьи. Огромное спасибо.
Статья супер, адрес в избранное
А вы знаете что когда вы нажимаете посмотреть! на одном из скриптов происходит xss атака??у меня просто защита стоит(noscript) всем посоветую
А вы знаете что когда вы нажимаете посмотреть! на одном из скриптов происходит xss атака??у меня просто защита стоит(noscript) всем посоветую
А если в FireFox тег div не реагирует на onkeyup (press и т.п.), можно ли ему прописать обработчик на событие onkeyup?
Вот еще один метод установки нескольких обработчиков событий, о котором не было сказано в статье:
И вызов данного метода:
А каким образом в данном подходе можно удалить один из вложенных обработчиков?
т.е. alert(‘1’); произойдет лишь один раз, в момент первого клика, после оно никогда не повториться (сколько не кликай). Но при ситуации нескольких обработчиков на одно событие данный код начнёт разрастаться как снежный ком. И код может стать не универсальным. 
Хотя, может кто из читателей сайта то придумает более симпатичное решение по удалению обработчика? 
Непонятно как реализовать функционал detachEvent в таком подходе.
Ну если честно, то по-моему мнению, в хорошем коде вообще в событии стоит лишь вызов функции, реагирующих на событие и ни какой логики по обработке события! 🙂
А показанный выше мной пример, скорее для того, что б все знали, что и такое тоже работает.
Непонятно как реализовать функционал detachEvent в таком подходе.
Сам думал долго над этим, но кроме варианта показанного чуть выше ничего не нашел.
—
С уважением, Владимир Вашурин
Отличная статья! Спасибо.
Есть еще нюанс, связанный со стилями для элементов. Если есть абсолютное позиционирование.
Например:
Если в стилях поменять position: relative на position: absolute для элемента (чем выше по дереву DOM, тем хуже), то в IE(6/7) событие даже не будет генерироваться.
Например поменяем для wndMain, то события вообще не будут генериться для его внутренних элементов и его самого(хоть какой кнопкой кликать).
Выложили бы что ли где-нибудь этот код. Я пока не понимаю, что такого IE делает не так.
У меня лично абсолютно позиционированные элементы обрабатывались всегда без проблем. Может, чего-то не заметил?
Дело не в нюансах, у вас проблема с версткой, точнее с перекрытием элементов, barStatus если позиционировать абсолютно перекрывает barTitle на которорый и вешается событие. а по причине того, что элементы друг в друга не вложены всплытия события не происходит.
P.S. Знаю что некропост, просто такие комменты могу ввести в заблуждение тех кто этот инструмент (javascript) осваивает.
Спасибо! Это лучший сайт по ява-скрипту! )))
Если необходимо прикрепить обработчик для события, передав ему параметры, специфичные для данного объекта, то как это сделать?
Например, при таком назначении в момент прикрепления сразу произойдёт вызов alert(‘test’)
Если же вместо al(‘test’) использовать function()< al('test') >, то позже, как я понимаю, будет сложность снять этот обработчик?
Отличная статья. Доходчиво изложено и с примерами 
Хотелось бы видеть развитие темы, углубление. В связи с этим появился вопрос. В статье было сказано что.
При установке обработчиков методами attachEvent/detachEvent this внутри обработчика всегда указывает на объект window и совершенно бесполезен.
Поэтому при использовании этих методов в библиотеках и фреймворках добавляется дополнительная «обертка для обработчика», устанавливающая правильный this.
Приведите, пожалуйста, пример реализации «обертки» или посоветуйте где об этом можно почитать?
Спасибо за статью, за существование этого сайта.
тут наверно вместо fromElement надо toElement;
Спасибо полезная информация особенно про захват
Методы
myElement.attachEvent(«on» + событие, обработчик) и
myElement.detachEvent(«on» + событие, обработчик)
поддерживает не только IE, но и Opera
Универсальный кроссбраузерный способ обработки событий:
а функцию attachEvents записать вот так:
Да, ну и вызвать функцию main() в документе:
Объясните пожалуйста,
если у DOM элемента несколько свойств,
на которые повешены обработчики событий мыши,
то в какой последовательности они будут срабатывать?
Например при наведении на него и щелчке мыши:
и еще, чем отличается
onmouseover=»return fun1(arg1,arg2)»
от
onmouseover=»fun1(arg1,arg2)»
и куда собственно эти функции возвращают значение(если возвращают)?
Вот не пойму никак, а чего событие onclick() можно только Id присваивать, всему классу одно событие нельзя?
Например:
Вот так работает:
Кстати, селекторы библиотеки jQuery предоставляют возможность вешать обработчики на список.
Илья Кантор спасибо
Просто я уже третий день бьюсь вот над такой задачей:
И нужно присвоить одно событие onclick для всех ссылок. Не подскажете как это можно организовать?
Все решил задачу Спасибо за наводку, сам бы не догадался
никогда не задумывался и писал всегда «ev = ev || window.event».
но ведь «ev» не передается только если обработчик задан так
те если нигде не ошибся то «ev = ev || window.event» совсем и не нужно когда речь идет о EventListener
В Internet Explorer существует глобальный объект window.event, который хранит в себе информацию о последнем событии. А первого аргумента обработчика просто нет.
это не так. еще ие6 вполне корректно выполнял строчку
Ещё один способ напоследок:
Доброго всем дня.
Объясните пожалуйста для «чайников» как правильно кроссбраузерно остановить всплытие. на своих примерах получается только для IE сделать или только для FF.
в javascript документе
Судя по описанной вами проблеме, строчка:
Выполняется до того как сгенерится сам элемент. И следовательно выполнится:
И корректно (вернее не корректно, а так чтобы работало) обработает только Опера. В остальных браузерах скрипт упадет в ошибку. А вот если перенести скрипт в конец, то все будет работать.
Здравствуйте, подскажите пожалуйста как организовать таку вещь:
мне нужно что бы при окне браузера развернутом не в максимайзе(т.е. не на весь экран) и при этом стрница находится в граничном положении(самый низ/верх/право/лево) при расширении окна вручную(когда наводишь на грань браузера и начинаешь ее увеличивать как хочешь) в сторону от границы наружу, сторона приклеевалась к стороне браузера, помогите плз.
На самом деле, capturing в IE использовать можно. Ограничений масса: метод расчитан только на события мыши, перехват теряется при потере окном фокуса, геморройная работа с preventDefault и масса других факторов.
Но если в целом, это вкупе с альтернативными макрософтовыми событиями (напр. activate и deactivate — такие же focus и blur, только бабблятся) может помочь сделать более-менее вменяемую эмуляцию capturing.
Иллюстрация метода setCapture:
Не пугайтесь: в IE6 этот код может вызвать блокировку окна.
Под диспетчером (dispatcher) подразумевается некий корневой элемент, собирающий события, и потом обрабатывающий их с учетом (e.srcElement||e.target), т.е., непосредственно практическое применение capturing.
вызов идет до создания кнопки?
Не могли бы подробнее?
«Кликни меня
При клике перехода не произойдет, а рамка вокруг ссылки появится.»
В IE8 сыпется иксепшн а в хроме нет рамки
Chrome не выделяет таким образом активные ссылки по стандарту.
Но можно сделать, добавив в css:
Аналогичным же способом данную пунктирную рамку можно убрать из firefox.
(P.S. Извиняюсь что не по коду, IE для меня пока не доступен.)
А в ie «перебрасывает» на верх страницы, наверное из-за #
Че то вообще ничего не понятно. Когда начнется объяснение нормальное.. Может кто нить подкинет что нибудь по проще..Для новичка?7
С какого момента непонятно? Что непонятно?
А можно вопрос, использую
в FF срабатывает нормально, а в IE событие не присваивается
все разобрался для IE написал
Хороший сайт, но к сожалению ссылку на вас разместить негде. Но советовать буду обязательно.
Сколько не вчитывался в статью и приведенные в кометариях примеры, так и не смог понять как сделать в приведенном ниже примере так. Что бы событие срабатывало только для первого элемента, но не страбатывало для вложеных в него.
Но из статьи я так и не понял как ОСТАНОВИТЬ срабатывание события на «дочерних» к первому элементах, или если сказать по другому. как запретить наследование события «дочерними» элементами.
Очень надеюсь на помощь знающих людей.
Вписать обработчик того же события для всех потомков первого уровня, в котором добавить event.stopPropagation()(для Лисы)
Небольшое уточнение к моему предыдущему посту, цель не просто остановить обработку событий, это можно было бы просто организовать через:
А сделать страбатывание Алерта в любом случае, даже когда onmouseover происходит над областями даже перекрытое Div с и
Еще раз. алерт должен выполнится только один раз, при наведении на любой из DIV’ов, учитывая что обработка события запускается с старшего в ерархии элемента.
Теперь перейдем собственно к вашему вопросу. Для удобства понимания сути проблемы лучше переформулировать задачу так: mouseover не должен вызываться в случае, если переход мыши осуществляется между потомками одного корневого элемента(или между потомками и самим корневым элементом). Теперь способ решения становится очевиден. В обработчике корневого элемента производится проверка target и relatedTarget(toElement и fromElement). Если оба объекта имеют общим предком корневой элемент, то обработчик ничего не делает.
отличная статья, но меня интересует вопрос: можно ли из javascript управлять перемещением курсоры мышки?
Помогите пожалуйста
есть такая функция(код из вашей статьи)
эта функция присваивается событию onScroll,в идеале нужно чтобы при прокручивании скрола,блок «my-message» оставался на месте,но при этом он перескакивает-как это можно исправить?
Для этого существует css правило position:fixed. А ИЕ6 бодро идет лесом
Ах, я вас так понимаю.
М. Есть возможность поверять, находится ли курсор мыши над объектом? Предположим, функция запускается, когда над объектом курсор мышки, в ней есть задержка, и некоторая другая функция запускается после этой задержки, но в случае, если курсор мыши остался над объектом. Как проверить?
Устанавливать флажок в событии mouseover. Снимать флажок в событии mouseout. В «некоторой другой» функции проверять значение флажка.
Гость, спасибо! Да, старею я, похоже.
Что в этой шняге неправильно?
Вообще понять не могу. У меня в браузере кнопка не получила никакого события. Страница загрузилась и сразу «Не активный кнопкоо! ))». Почему так? При том такая ситуация только в FF 3.5. Opera, Chrome, Safari выполняют скрипт именно так, как я ожидаю. В IE не пробовал.
Это проблема FF, как оказалось Разобрался
После данной статьи, я возненавидел окончательно и основательно, бесповоротно и навсегда IE.
В IE6 «йа кнопкоо» работает нормально.
Добрый вечер!Не могу понять, почему не работает обычный пример как в статье(в JS совсем еще зеленый), то есть при клике на #pip эффекта никакого
и соответственно html
Причем Лис FireBug’ом ошибок не выдает
Привет
Не работает потому что
1. addEventListener в качестве первого параметра принимает имя события без префикса on h.addEventListener(«click», p, false);
2. li с обработчиком event.stopPropagation() перекрывает распространиение события к предку, попробуйте раскрасить список и все станет очевидно. Красная область кликабельная, так как клик происходит непосредственно на элементе ul, а вот синяя перекрытая stopPropagation и алерта нету.
Мне надо заблокировать все события на странице, в особенности onmousedown, onkeydown (onclick, ondblclick тоже). Чтобы и мышка, и клавиатура страницей на какое-то время не обрабатывалась. Как это сделать?
Такая штука не срабатывает (explorer игнорирую):
Мне надо заблокировать все события на странице, в особенности onmousedown, onkeydown (onclick, ondblclick тоже). Чтобы и мышка, и клавиатура страницей на какое-то время не обрабатывалась. Как это сделать?
Вариант 1. Вернуть false при возникновении события.
Пример:
но в таком случае вложенные элементы со своими событиями будут отрабатывать (из-за перехвата).
Вариант 2. Заблокировать клики мыши лежащим слоем overlay по верх всех элементов.
Пример:
и 2 варианта вместе тоже можно применять.
У меня такой вопрос: допустим написал свою очень нужную функцию (myfunction), приаттачил к HTML такой файлик: