Jeśli programujesz w JavaScript, prawdopodobnie natrafiłeś na sytuację, w której chcesz mieć menu, które otwierają się po kliknięciu i które zamykają się, gdy użytkownik kliknie poza menu. Opracowałem dość prosty sposób, aby to zrobić. Dodaję detektor zdarzeń do treści dokumentu. Gdy ktoś ją kliknie, szukamy docelowego identyfikatora zdarzenia. Jeśli pasuje do identyfikatora div pola, nie rób nic. Jeśli nie, zamknij menu.
Co więcej, nieefektywne jest pozostawienie detektora zdarzeń kliknięcia na całym ciele, gdy nie jest ono używane. W takim przypadku, jeśli menu nie zostało jeszcze otwarte, nie ma powodu, aby słuchać kliknięcia poza menu. Dodaj detektor zdarzeń do wywołania zwrotnego wyświetlanego elementu div. W tym samym stylu, gdy div jest ponownie ukryty, usuń detektor zdarzeń.
Pokaż Div Kliknij wewnątrz czarnej skrzynki, nic się nie dzieje. Kliknij na zewnątrz, znika $ ('# showbox'). Kliknij (function () {$ ('# bigbox'). Show (function () {document.body.addEventListener ('click', boxCloser, false);}) ;}); function boxCloser (e) {if (e.target.id! = 'bigbox') {document.body.removeEventListener ('click', boxCloser, false); $ ('# bigbox'). hide (); }}
Upewnij się również, czy w swoim projekcie umieściłeś jQuery, ponieważ niektóre z powyższych funkcji korzystają z tej biblioteki.