Anonim

Če programirate v Javascriptu, ste verjetno naleteli na situacijo, ko želite imeti menije, ki se odprejo s klikom in ki se zaprejo, ko uporabnik klikne zunaj menija. Razvil sem precej preprost način za to. Telo dokumenta dodam poslušalca dogodka. Ko nekdo klikne, iščemo ciljni id dogodka. Če se ujema z ID-jem škatlice, potem ne storite ničesar. Če ne, zaprite meni.

Če gremo še malo naprej, je neučinkovito pustiti poslušalca dogodkov klika po celotnem telesu, ko ga ne uporabljamo. V tem primeru, če menija še niste odprli, ni razloga za poslušanje klika zunaj menija. V povratni klic prikazanega diva dodajte poslušalca dogodka. V isti točki, ko se div ponovno skriva, odstranite poslušalca dogodkov.

Prikaži Div Kliknite znotraj črnega polja, nič se ne zgodi. Kliknite zunaj, izgine $ ('# showbox'). Kliknite (funkcija () {$ ('# bigbox'). Show (funkcija () {document.body.addEventListener ('klik', boxCloser, false);}) ;}); funkcija boxCloser (e) {if (e.target.id! = 'bigbox') {document.body.removeEventListener ('klik', boxCloser, false); $ ('# bigbox'). skrivaj (); }}

Prepričajte se tudi, da ste v svoj projekt vključili jQuery, saj nekatere zgornje funkcije uporabljajo to knjižnico.

Zaprite div ali meni s klikom zunaj w / javascripta