หากคุณเคยจัดการกับเมนูที่เปิดขึ้นเมื่อคลิก แต่ต้องการให้ปิดเมื่อผู้ใช้คลิกนอกพื้นที่เมนูต่อไปนี้เป็นวิธีง่ายๆในการทำ ฉันเพิ่มตัวฟังเหตุการณ์ในเนื้อหาของเอกสาร เมื่อมีคนคลิกที่เราจะมองหา ID เป้าหมายของกิจกรรม หากตรงกับ ID ของ div ของกล่องแล้วไม่ทำอะไรเลย ถ้าไม่ปิดเมนู
ใช้เวลาเพียงเล็กน้อยต่อไปไม่มีประสิทธิภาพในการปล่อยฟังเหตุการณ์การคลิกในเนื้อหาทั้งหมดเมื่อไม่ได้ใช้งาน ในกรณีนี้หากยังไม่ได้เปิดเมนูก็ไม่มีเหตุผลที่จะฟังคลิกนอกเมนู เพิ่มตัวฟังเหตุการณ์ในการโทรกลับของ div ที่กำลังแสดง ในหลอดเลือดดำที่เดียวกันเมื่อ div ถูกซ่อนอีกครั้งเอาฟังเหตุการณ์
Show Div คลิกที่ช่องสีดำไม่มีอะไรเกิดขึ้น คลิกด้านนอกมันหายไป $ ('# showbox') คลิก (function () {$ ('bigbox')) show (function () {document.body.addEventListener ('click', boxCloser, false);}) ;}); กล่องฟังก์ชั่น Closer (e) {if (e.target.id! = 'bigbox') {document.body.removeEventListener ('click', boxCloser, false); $ ( '# bigbox') ซ่อน (). }} ดูตัวอย่างการทำงาน
นอกจากนี้ตรวจสอบให้แน่ใจว่าคุณได้รวม jQuery เนื่องจากฟังก์ชันบางอย่างด้านบนใช้ไลบรารี
