ترتيب الأحداث
لنفترض أن هناك عنصرًا آخر متداخلًا في عنصر واحد ولديه معالج حدث onclick. إذا انقر المستخدم على العنصر 2 ، يتم تشغيل أحداث النقر للعنصر 1 والعنصر 2. ولكن أي حدث يتم تشغيله أولاً؟ ما هي وظيفة معالج الأحداث التي سيتم تنفيذها أولاً؟ بمعنى آخر ، ما هو الترتيب في أي أحداث تحدث؟ كما هو موضح في الشكل أدناه ، عندما يتم النقر على منطقة عنصر Span ، سيتم تشغيل أحداث النقرات الثلاثة ، ولكن ما هو الترتيب؟
<div onClick = "func1"> <p onClick = "func2"> <span onClick = "" func3> </pan> </p> </viv>
نموذجان
لدى Netscape و Microsoft طريقتين مختلفتين تمامًا للتعامل مع هذا الحدث:
• يدعو Netscape أن تحدث الأحداث من الطبقة الخارجية إلى العنصر الأكثر تحديداً ، ويسمى تسلسل الأحداث هذا نوع الالتقاط
• تحتفظ Microsoft بالأحداث من العنصر الأعمق ثم تنتشر لأعلى. يسمى تسلسل الأحداث هذا نوع الفقاعة
ترتيب هذين الحدثين معاكس تماما. يدعم متصفح Explorer فقط أحداث الفقاعات ، كل من Mozilla و Opera7 و Konqueror. لا تدعم الأوبرا القديمة و ICAB ولا
W3C
أي حدث يحدث في نموذج حدث W3C يدخل أولاً مرحلة الالتقاط حتى يتم الوصول إلى العنصر المستهدف ثم يدخل مرحلة الفقاعة.
لتطوير الويب العادي ، يمكنك اختيار ربط وظيفة معالج الحدث في مرحلة الالتقاط أو مرحلة الفقاعة. يتم تحقيق ذلك من خلال طريقة addeventListener (). إذا كانت معلمة useCapture لهذه الوظيفة صحيحة ، فستكون الوظيفة مرتبطة في مرحلة الالتقاط ، والعكس صحيح ، فإن الوظيفة مرتبطة في مرحلة الفقاعة.
element.addeventListener (الحدث ، الوظيفة ، usecapture)
توقف عن الفقاعات
أثناء التطور العادي ، إذا كنت ترغب في منع انتشار الأحداث ، فيمكنك القيام بذلك من خلال طريقة واحدة.
في طراز Microsoft ، يجب عليك تعيين خاصية CancelBubble للحدث إلى True
window.event.cancelbubble = true
في نموذج W3C ، يجب أن تسمي طريقة StopPropagation () للحدث
estoppropagation ()
إن استدعاء هذه الأساليب سيمنع جميع الفقاعات من الانتشار إلى الخارج. حل المتصفح المتقاطع:
دالة dosomething (e) {if (! e) {var e = window.event ؛ e.cancelBubble = true ؛ } if ( }}المقالة أعلاه الفهم المتعمق لفقاعات الأحداث والتقاط الأحداث هو كل المحتوى الذي شاركته معك. آمل أن يعطيك مرجعًا وآمل أن تتمكن من دعم wulin.com أكثر.