Anonim

אם אתה מתכנת ב- Javascript, בטח נתקלת במצב בו אתה רוצה שיהיו לך תפריטים שנפתחים בלחיצה אחת, ונסגרים כאשר המשתמש לוחץ מחוץ לתפריט. פיתחתי דרך די פשוטה לעשות בדיוק את זה. אני מוסיף מאזין לאירוע לגוף המסמך. כשמישהו לוחץ עליו, אנו מחפשים את מזהה היעד של האירוע. אם זה תואם למזהה של חטיבת התיבה, אל תעשו דבר. אם לא, סגור את התפריט.

בהמשך הדברים, אין זה יעיל להשאיר מאזין לאירועי קליקים על כל הגוף כשלא משתמשים בו. במקרה זה, אם התפריט עדיין לא נפתח, אין שום סיבה להאזין ללחיצה מחוץ לתפריט. הוסף את מאזין האירוע בקריאה חוזרת של הדיוויד שמוצג. באותה הווריד, כאשר ה div מסתתר שוב, הסר את מאזין האירועים.

הצג Div לחץ בתוך התיבה השחורה, שום דבר לא קורה. לחץ על החוץ, הוא נעלם $ ('# showbox'). לחץ (פונקציה () {$ ('# bigbox'). Show (function () {document.body.addEventListener ('לחץ', boxCloser, false);}) ;}); פונקצית boxCloser (e) {if (e.target.id! = 'bigbox') {document.body.removeEventListener ('לחץ', boxCloser, false); $ ('# bigbox'). להסתיר (); }}

כמו כן, הקפד לכלול jQuery בפרוייקט שלך מכיוון שחלק מהפונקציונליות שלמעלה משתמשת בספריה זו.

סגור div או תפריט בלחיצה מחוץ w / javascript