Если вы программируете в Javascript, вы, вероятно, сталкивались с ситуацией, когда вы хотите, чтобы меню открывались по щелчку и закрывались, когда пользователь щелкает за пределами меню. Я разработал довольно простой способ сделать это. Я добавляю прослушиватель событий в тело документа. Когда кто-то щелкает по нему, мы ищем целевой идентификатор события. Если он совпадает с идентификатором div коробки, то ничего не делать. Если это не так, закройте меню.
Если пойти немного дальше, неэффективно оставлять прослушиватель событий щелчка по всему телу, когда он не используется. В этом случае, если меню еще не было открыто, нет смысла прослушивать щелчок за пределами меню. Добавьте прослушиватель событий в обратный вызов показываемого div. В том же духе, когда div снова скрывается, удалите прослушиватель событий.
Показать Div Нажмите внутри черного ящика, ничего не происходит. Нажмите снаружи, он исчезает $ ( '# Showbox'). Нажмите (функция () { $ ( '# BigBox'). Показать (функция () { document.body.addEventListener ('click', boxCloser, false); }); }); function boxCloser (e) { if (e.target.id! = 'bigbox') { document.body.removeEventListener ('click', boxCloser, false); $ ( '# BigBox') скрыть (). } }
Также убедитесь, что вы включили jQuery в свой проект, так как некоторые из перечисленных выше функций используют эту библиотеку.