إذا قمت بالبرمجة في Javascript ، فمن المحتمل أنك واجهت الموقف الذي تريد أن يكون لديك فيه القوائم التي تفتح بنقرة واحدة ، وتغلق عندما ينقر المستخدم خارج القائمة. لقد طورت طريقة بسيطة جدا للقيام بذلك. أقوم بإضافة مستمع حدث إلى نص المستند. عندما يقوم شخص ما بالنقر فوقه ، فإننا نبحث عن المعرف المستهدف للحدث. إذا كان يطابق معرف div في المربع ، فلا تفعل شيئًا. إذا لم يحدث ذلك ، فأغلق القائمة.
إذا أخذنا بعض الشيء إلى أبعد من ذلك ، فلن يكون من الفعال ترك مستمع حدث النقر على كامل الجسم عندما لا يتم استخدامه. في هذه الحالة ، إذا لم يتم فتح القائمة حتى الآن ، فلا يوجد سبب للاستماع إلى نقرة خارج القائمة. أضف مستمع الحدث في رد الاتصال div الذي يتم عرضه. في نفس السياق ، عندما يتم إخفاء div مرة أخرى ، أزل مستمع الحدث.
إظهار Div انقر داخل الصندوق الأسود ، لا يحدث شيء. انقر خارج ، ويختفي $ ('# showbox'). انقر فوق (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') إخفاء ()؛ }}
تأكد أيضًا من تضمين jQuery في مشروعك لأن بعض الوظائف المذكورة أعلاه تستخدم تلك المكتبة.
