1. أحداث الفقاعة
هناك نوعان من نماذج الأحداث للمتصفحات: أحداث التقاط وأحداث الفقاعات. نظرًا لأن IE لا يدعم أحداث الالتقاط ، فإن ما يلي يستخدم أحداث الفقاعات بشكل أساسي كتفسير.
يشير نوع Bubble (Dobbed Bubble) إلى الحدث الأكثر تحديداً إلى الحدث الأقل تحديدًا الذي تم تشغيله واحدًا تلو الآخر.
نسخة الكود كما يلي:
<body onClick = "add ('body <br>')">
<div onclick = "add ('div <br>')">
<ponclick = "إضافة ('p <br>')"> انقر فوق لي </p>
</div>
</body>
<div id = "display">
</div>
<script type = "text/javaScript">
وظيفة إضافة (stext) {
var ulo = document.getElementById ("display") ؛
ulo.innerhtml += stext ؛
}
</script>
أضافت الوظائف الثلاث المذكورة أعلاه وظيفة OnClick. يتم إطلاق الوظائف الثلاثة بعد عنصر P المستقل. يتم تنفيذ عنصر P لأول مرة ، ثم يتم تنفيذ DIV ، وأخيراً يتم تنفيذ الهيئة.
هنا ، هنا تذكير بحدث التقاط ، وترتيبه هو بالضبط عكس حدث الفقاعة.
2. مراقبة الحدث
يتطلب الحدث وظيفة للرد. هذا النوع من الوظائف عادة ما يسمى معالج الأحداث. من منظور آخر ، تستمع هذه الوظائف في الوقت الفعلي سواء حدث حدث ، عادة ما يسمى مستمع الحدث. وظيفة الاستماع الحدث مختلفة تمامًا عن المتصفحات المختلفة.
أنا. طريقة الاستماع العامة ، مثل استخدام طريقة OnClick ، تدعم كل علامة هذه الطريقة تقريبًا. وتوافق المتصفح مرتفع للغاية
النظر في السلوك ، فصل الأحداث.
بشكل عام ، راقب باستخدام الطرق التالية
نسخة الكود كما يلي:
<body>
<div id = "me"> انقر فوق </div>
<script type = "text/javaScript">
var opp = document.getElementById ("me") ؛ // تم العثور على الحدث
Opp.Onclick = function () {// set وظيفة الحدث
تنبيه ("تم النقر علي!")
}
</script>
</body>
كلتا الطريقتين المقدمة أعلاه مريحة للغاية ويحبانها مطورو Everbright عند صنع بعض الوظائف الصغيرة والتعامل معها. ولكن لنفس الحدث. يمكنهم إضافة وظيفة واحدة فقط ، مثل وظيفة OnClick التي تميزت بـ P. كلتا الطريقتين يمكن أن يكون لها وظيفة واحدة فقط. لذلك ، فإن IE لها حلها الخاص ، وزملاؤه ، و Standard DOM ينص على طريقة أخرى.
الثاني. طريقة المراقبة في IE
في متصفح الصباح ، يحتوي كل عنصر على طريقتين للتعامل مع الاستماع إلى الوقت.
هي المرفق () و detachenevt () على التوالي.
كما ترون من أسماء الوظائف الخاصة بهم ، فإن AttanceenVt () هي وظيفة تستخدم لإضافة معالجة الأحداث إلى عنصر ، بينما يتم استخدام detachevent () لحذف وظيفة الاستماع على العنصر. بناء الجملة الخاص بهم على النحو التالي:
[Object] .attachevent ("enevt_handler" ، "fnhandler") ؛
[Object] .detachevent ("enevt_handler" ، "fnhandler") ؛
من بينها ، يمثل enevt_handler onclick شائع الاستخدام ، onload ، onMouseover ، إلخ.
Fnhandler هو اسم وظيفة المستمع.
في القسم السابق ، يمكنك استخدام طريقة ancloyevent () بدلاً من إضافة وظيفة الاستماع. عند النقر فوقه ، يمكنك استخدام detachevent () لحذف وظيفة الاستماع حتى لا يتم تنفيذها بعد النقر التالي.
نسخة الكود كما يلي:
<script type = "text/javaScript">
وظيفة fnclick () {
تنبيه ("تم النقر علي!") ؛
op.detachevent ("onclick" ، "fnclick") ؛
}
var op ؛
window.onload = function () {
op = document.getElementById ("OOP") ؛ // ابحث عن الكائن
op.attachevent ("onclick" ، "fnclick") ؛ // أضف وظيفة المستمع
}
</script>
<viv>
<p id = "OOP">
</p>
</div>
ثالثا. أضف أحداث الاستماع المتعددة (أي)
نسخة الكود كما يلي:
<script language = "javaScript">
وظيفة fnclick1 () {
ALERT ("لقد تم النقر عليها بواسطة FnClick1") ؛
}
وظيفة fnclick2 () {
ALERT ("تم النقر على FNCLICK2") ؛
//op.detachevent("onclick"،fnclick1) ؛ // حذف وظيفة المستمع 1
}
var op ؛
window.onload = function () {
op = document.getElementById ("myp") ؛ // ابحث عن الكائن
op.attachevent ("onclick" ، fnclick1) ؛ // إضافة وظيفة المستمع 1
op.attachevent ("onclick" ، fnclick2) ؛ // أضف وظيفة المستمع 2
}
</script>
</head>
<body>
<viv>
<p id = "myp"> انقر لي </p>
</div>
3. مراقبة أحداث DOM القياسية
مع طريقتي IE ، يستخدم DOM القياسي أيضًا طريقتين لإضافة وحذف وظيفة المستمع على التوالي. أي addeventListener () و removeEventListener ()
على عكس IE ، تقبل هاتان وظيفتان 3 معلمات ، وهما اسم الحدث ، واسم الوظيفة المراد تعيينها ، وما إذا كانت تستخدم في مرحلة الفقاعة أو مرحلة الالتقاط. معلمات مرحلة الالتقاط صحيحة ، ومعلمات مرحلة الفقاعة خاطئة. بناء الجملة كما يلي:
نسخة الكود كما يلي:
[Object] .adDeventListener ("event_name" ، fnhandler ، bcapture) ؛
[Object] .RemoveEventListener ("event_name" ، fnhandler ، bcapture) ؛
تتشابه طرق استخدام هاتين الوظيفتين بشكل أساسي مع IE ، ولكن يجب أن تلاحظ أن اسم Event_Name هو "Click" و "Mouseover" ، وما إلى ذلك ، بدلاً من "Onclick" و "onMouseover" في IE.
بالإضافة إلى ذلك ، عادة ما يتم ضبط المعلمة الثالثة bcapture على خطأ ، في مرحلة الفقاعات.
طريقة الاستماع الحدث القياسي DOM:
نسخة الكود كما يلي:
<script language = "javaScript">
وظيفة fnclick1 () {
تنبيه ("تم النقر على 1") ؛
op.removeeventListener ("Click" ، fnclick1 ، false) ؛
}
وظيفة fnclick2 () {
تنبيه ("تم النقر على 2") ؛
}
window.onload = function () {
op = document.getElementById ("myp") ؛
op.adDeventListener ("Click" ، fnclick1 ، false) ؛
op.addeventListener ("Click" ، fnclick2 ، false) ؛
}
</script>
<viv>
<p id = "myp"> انقر لي </p>
</div>
يمكنك اختبار أمر التنفيذ المحدد.
ما سبق هو كل شيء عن هذا المقال ، أتمنى أن تنال إعجابك.