return false что это
Действия браузера по умолчанию
Многие события автоматически влекут за собой действие браузера.
Если мы обрабатываем событие в 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 лучше с точки зрения доступности для людей с ограниченными возможностями и с особых устройств.
На этом уроке мы рассмотрим, как можно отменить стандартные действия браузера, которые происходят, когда пользователь взаимодействует с некоторыми элементами веб-страницы. Также узнаем как отмена стандартного действия, которое выполняет браузер, влияет не его всплытие.
Действия браузера по умолчанию
Имеется много различных событий, при наступлении которых браузер выполняет определённые стандартные действия:
Отмена стандартного действия браузера
Отмена стандартного действия браузера осуществляется посредством вызова метода preventDefault в обработчике события.
Возможность отменять стандартные действия браузера очень часто применяются перед отправкой формы на сервер. Она используется для того чтобы проверить правильность заполнения формы с помощью скриптов JavaScript.
Влияет ли отмена стандартного действия, которое выполняет браузер, на его всплытие
В этом разделе мы рассмотрим следующий вопрос: «Влияет ли на всплытие события то, что мы отменили выполнение стандартного действия браузера, которое с ним связано?»
Чтобы разобраться в этом вопросе, давайте рассмотрим следующий пример:
Следовательно, отмена стандартного действия браузера для некоторого события не влияет на всплытие пузырька (события), т.е. они выполняются не зависимо друг от друга
В ситуациях, когда Вам необходимо отменить стандартное действие браузера и всплытие события (пузырька), можно использовать следующий код:
Как правильно использовать return в JavaScript функции
Для чего необходим оператор return в JavaScript функции? Как его использовать внутри функции и что можно делать с возвращаемыми значениями? Сегодня мы поговорим об этом.
Для чего необходим return в JavaScript функции
Это позволяет сделает код более модульным. Есть много разных подходов к написанию кода. Но чаще всего return в JavaScript функции нужен для организации модульного подхода.
Бывают случаи, когда нет возможности применить тернарный оператор или существует необходимость использовать один и тот же фрагмент кода в нескольких местах в рамках одного проекта. В этом случае лучше обернуть его в отдельную функцию. Если речь идет о создании длиной HTML-строки, то наилучший вариант — сохранить ее в отдельной функции для удобства чтения.
Давайте рассмотрим на несколько примеров.
Возврат строки, числа или другого типа данных
Представим, что мы используем какое-то имя (name), введенное пользователем, для создания некоторой HTML-разметки в пользовательском интерфейсе.
В этом примере можно было бы поступить следующим образом. Сначала создать собственную функцию и вписать внутрь эти строки. После этого можно использовать return, который вернет элемент p в переменной. Это позволит использовать ее в коде в дальнейшем.
Конечно, это достаточно простой и даже глупый пример, потому что return в JavaScript функции возвращает всего лишь один абзац. Но по мере увеличения объема кода растет и полезность этого подхода.
Возврат логического типа данных с помощью return в JavaScript функции
Return может быть очень полезным, когда требуется выполнить более сложные проверки, выходящие за рамки простого if … else.
Например, в веб-приложении, которое показывает приобретенные пользователями электронные книги и курсы. Нужно проверить, приобрели ли они продукт, у которого есть доступ к приватной рабочей области Slack. Если да, то пользователь видит кнопку для получения ссылки для приглашения. В противном случае то вместо этого высвечивается сообщение.
Объект «данных о покупке» (data) выглядит примерно так:
Далее необходимо сделать проверку на соответствие одному или нескольким из следующих условий:
Если любое из этих условий выполнено, можно показать пользователю кнопку.
Такой подход основан на слишком сложной логике. Такой код является рабочим, но он не очень читабельный и его трудно поддерживать. Очень легко ошибиться в одном из условий.
В этом случае return в JavaScript функции поможет упростить этот подход. Он вернет true, если у пользователя есть доступ, и false, если нет. В этом случае происходит отдельно запуск каждого условия для проверки с возвратом true или false.
Да, этот код выглядит длиннее. Но он более читабельный. Его легко изменять и контролировать, какие условия проверяются. А читабельность важнее краткости.
Теперь давайте вернемся к функции renderSlack(). И если условия предоставления доступа к Slack когда-либо изменятся, достаточно просто обновить функцию hasSlack(), не внося изменений в остальной код.
Заключение
Надеюсь, это поможет вам понять, как можно использовать return в JavaScript функции. Это организационный инструмент, который позволяет структурировать код и сделать его более читабельным.
Event.preventDefault() vs. return false
Когда я хочу, чтобы другие обработчики событий выполнялись после запуска определенного события, я могу использовать один из двух методов. Я буду использовать jQuery в примерах, но это относится и к plain-JS:
1. event.preventDefault()
2. return false
Есть ли существенная разница между этими двумя способами прекращения распространения события?
Для меня return false; проще, короче и, вероятно, меньше подвержен ошибкам, чем выполнение метода. С помощью этого метода вы должны помнить о правильном корпусе, скобках и т.д.
Кроме того, я должен определить первый параметр в обратном вызове, чтобы иметь возможность вызвать метод. Возможно, есть несколько причин, почему я должен избегать этого и использовать preventDefault вместо этого? Какой лучший способ?
ОТВЕТЫ
Ответ 1
return false из обработчика события jQuery фактически является тем же самым, что и вызов e.preventDefault и e.stopPropagation в переданном объекте jQuery.Event.
e.preventDefault() предотвратит возникновение события по умолчанию, e.stopPropagation() предотвратит разбухание события и return false сделает оба. Обратите внимание, что это поведение отличается от обычных (не jQuery) обработчиков событий, в которых, в частности, return false не останавливает событие от пузырьков.
Ответ 2
По моему опыту, существует хотя бы одно явное преимущество при использовании функции event.preventDefault() с использованием return false. Предположим, вы захватили событие click на теге привязки, иначе это было бы большой проблемой, если бы пользователь должен был перейти от текущей страницы. Если ваш обработчик кликов использует return false, чтобы предотвратить навигацию браузера, он открывает возможность того, что интерпретатор не достигнет оператора return, и браузер продолжит выполнение поведения по умолчанию для якорных тегов.
Преимущество использования event.preventDefault() заключается в том, что вы можете добавить это как первую строку в обработчике, тем самым гарантируя, что поведение по умолчанию по умолчанию не будет срабатывать, независимо от того, не будет ли достигнута последняя строка функции (например,.).
Ответ 3
Это не так, как вы его назвали, вопрос «JavaScript»; это вопрос о дизайне jQuery.
jQuery и ранее связанная цитата от John Resig (karim79 сообщение), по-видимому, является источником непонимания того, как обработчики событий в целом работают.
Факт: обработчик событий, который возвращает false, предотвращает действие по умолчанию для этого события. Это не останавливает распространение события. Обработчики событий всегда работали таким образом, начиная с старых дней Netscape Navigator.
Документация из MDN объясняет, как return false в обработчике событий работает
Ответ 4
Как правило, вам следует выбрать первый вариант ( preventDefault() ), но вы должны знать, в каком контексте вы находитесь, и каковы ваши цели.
Ответ 5
При использовании jQuery return false выполняет 3 отдельные операции, когда вы вызываете это:
См. jQuery Events: Stop (Mis) Использование Return False для получения дополнительной информации и примеров.
Ответ 6
Ответ 7
это w3c указанный способ отмены событий.
Вы можете прочитать это в спецификации W3C по отмене событий.
Также вы не можете использовать return false в любой ситуации. При предоставлении функции javascript в атрибуте href и если вы возвращаете false, пользователь будет перенаправлен на страницу с записанной ложной строкой.
Ответ 8
Но если вы уверены, что код не будет вызывать каких-либо исключений, вы можете пойти с любым из методов, которые вы хотите.
Ответ 9
Мое мнение по моему опыту говорит, что всегда лучше использовать
Практически для остановки или предотвращения отправки события, когда требуется, а не return false event.preventDefault() отлично работает.
Ответ 10
Основное различие между return false и event.preventDefault() заключается в том, что ваш код ниже return false не будет выполнен, а в случае event.preventDefault() ваш код будет выполняться после этого утверждения.
Когда вы пишете return false, вы делаете следующие вещи за кулисами.
Ответ 11
e.preventDefault();
Он просто останавливает действие элемента по умолчанию.
запрещает гиперссылку следовать URL-адресу, не позволяет отправить кнопку отправки формы. Когда у вас много обработчиков событий, и вы просто хотите предотвратить событие по умолчанию из-за этого, и из-за этого много раз, для этого нам нужно использовать в верхней части функции().
Причина использования e.preventDefault(); заключается в том, что в нашем коде так что-то не получается в коде, тогда он позволит выполнить ссылку или форму для отправки или разрешить выполнение или разрешить любые действия, которые вам нужно выполнить. & link или submit будет отправлена и все еще позволит продолжить распространение события.
Ответ 12
Разница между preventDefault() и возвращает false следующим образом:
preventDefault(): он просто останавливает поведение браузеров по умолчанию.
return false: он делает 3 отдельных объекта, когда вы его вызываете:
Использует согласно вашему требованию:
1) Если вы хотите просто запретить поведение браузера по умолчанию, используйте функцию preventDefault().
2) Если вы хотите предотвратить поведение браузера по умолчанию и предотвратить распространение события DOM, используйте return false.
Ответ 13
Таким образом, мы можем просто сказать, что возврат false в jQuery равен:
return false is e.preventDefault И e.stopPropagation
Но также не забывайте об этом в функциях, связанных с jQuery или DOM, когда вы запускаете его на элементе, в основном он предотвращает все, начиная с обжига, включая поведение по умолчанию и распространение события.
Форум
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 такой файлик: