Skip to content

Защитим в любой ситуации!

автоюристы по страховым выплатам
Главная | Земельные вопросы | Закрытие окна по клику за пределами

Скрыть элемент при клике за его пределами

Использование stopEventPropagation - это то, чего следует избегать, поскольку он нарушает нормальный поток событий в DOM.

перешел Закрытие окна по клику за пределами сущности

Вместо этого используйте этот метод. Прикрепите событие клика к телу документа, который закрывает окно. Прикрепите отдельное событие клика к окну, которое прекратит распространение в тело документа. Если это не так, то элемент с щелчком находится за пределами menucontainer, и вы можете с уверенностью скрыть его.

Первое решение

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

Похожие вопросы

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

Закрытие окна по клику за пределами простирался

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

Удивительно, но факт! Причина, по которой этот вопрос настолько популярен и имеет так много ответов, состоит в том, что он обманчиво сложный.

Итак, как мы можем обнаружить, что пользователь закончил использование диалога? Если вы не можете использовать jQuery, вы можете использовать blur на этапе захвата: Во-первых, ссылка в диалоговом окне не доступна.

Лизе Закрытие окна по клику за пределами ощущали

Попытка щелкнуть по нему или вкладку к ней приведет к закрытию диалогового окна до того, как произойдет взаимодействие. Это связано с тем, что фокусировка внутреннего элемента вызывает событие focusout перед тем, как снова запустить событие focusin. Исправление - очередь на изменение состояния в цикле событий.

Удивительно, но факт! Это можно сделать, используя setImmediate

Это можно сделать, используя setImmediate После того, как он поставлен в очередь, он может быть отменен последующим focusin: Это связано с тем, что диалог теряет фокус, вызывая срабатывание по закрытию, после чего щелчок по ссылке вызывает открытие диалогового окна.

Как и в предыдущем выпуске, нужно управлять состоянием фокусировки. Учитывая, что изменение состояния уже поставлено в очередь, это всего лишь вопрос обработки фокусных событий в диалоговом режиме: Это часто бывает "приятно иметь", но обычно бывает, что когда у вас есть модальный или всплывающий файл любого типа, который закрывает его клавиша Esc.

Если вы создаете меню, вы можете сфокусировать первый пункт меню. Роли WAI-ARIA и другая поддержка доступности Этот ответ, надеюсь, охватывает основы доступной поддержки клавиатуры и мыши для этой функции, но поскольку он уже довольно значителен, я собираюсь избегать обсуждения ролей и атрибутов WAI-ARIA , однако я настоятельно рекомендую, чтобы разработчики ссылались на спецификацию для подробностей о том, какие роли они должны использовать, и любых других соответствующих атрибутах.

Читайте также

  • Как оскорбить в аск и ответы
  • Узнать штрафгибдд подробно
  • Мошенничество на кассах
  • Возврат средств фсс за прошлый год проводки
  • Договор хранения транспортного средства образец
  • Можно ли ламинировать свидетельство