كائن الحدث: (كائن الحدث هو خاصية لكائن النافذة. عند حدوث حدث ما ، يتم إنشاء كائن الحدث في نفس الوقت. ينتهي الحدث ويختفي كائن الحدث)
IE: window.event ؛ // احصل على كائن
في DOM: وسيطة [0] ؛ // احصل على كائن
طرق السمة الشائعة لكائنات الأحداث في IE:
1.clientx: عند حدوث الحدث ، فإن الإحداثيات X لمؤشر الماوس في منطقة العميل (باستثناء أشرطة الأدوات ، وأشرطة التمرير ، إلخ) ؛
2.clienty: عند حدوث حدث ما ، فإن إحداثيات Y من مؤشر الماوس في منطقة العميل (باستثناء أشرطة الأدوات ، وأشرطة التمرير ، إلخ) ؛
3. keycode: بالنسبة لحدث رمز المفاتيح ، فإنه يشير إلى حرف Unicode للمفتاح المضغوط ، وبالنسبة لحدث KeyDown/Keyup ، فإنه يشير إلى أن لوحة المفاتيح المضغوطة هي مؤشر عددي (يحصل على قيمة المفتاح) ؛
4.OffSetx: الإحداثيات X لمؤشر الماوس بالنسبة للكائن الذي تسبب في الحدث ؛
5.offsety: إحداثي y لمؤشر الماوس بالنسبة للكائن الذي تسبب في الحدث ؛
6.Srcelement: العنصر الذي يتسبب في حدوث الحدث ؛
طرق السمة الشائعة لكائنات الأحداث في DOM:
1.clientx ؛
2.clienty ؛
3.pagex ؛ إحداثيات X من مؤشر الماوس بالنسبة إلى الصفحة ؛
4.pagey ؛ إحداثيات Y من مؤشر الماوس بالنسبة إلى الصفحة ؛
5.StopPropagation: يمكن أن يمنع استدعاء هذه الطريقة المزيد من انتشار الأحداث (الفقاعات) ؛
6. Target: عنصر/كائن الحدث المثير ؛
7.Type: اسم الحدث ؛
أوجه التشابه والاختلاف بين كائنين الحدث :
أوجه التشابه:
1. احصل على نوع الحدث ؛
2. احصل على رمز لوحة المفاتيح (حدث keydown/keyup) ؛
3. اكتشف التحول ، alt ، ctrl ؛
4. الحصول على إحداثيات منطقة العميل ؛
5. الحصول على إحداثيات الشاشة ؛
الاختلافات:
1. الحصول على الهدف ؛
// ie: var otarget = oevent.srcelement ؛
// dom: var otarget = oevent.target ؛
2. الحصول على رمز الحرف ؛
// ie: var icharcode = oevent.keycode ؛
// dom: var icharcode = oevent.charcode ؛
3. السلوك الافتراضي لحظر الأحداث ؛
// ie: oevent.RETURNVALUE = false ؛
// dom: oevent.preventDefault ؛
4. توقف عن الفقاعات:
//ie:oevent.cancelbubble=true ؛
//dom:oevent.stoppropagation
نوع الحدث:
1. حدث الماوس:
OnMouseover: عندما يتم نقل الماوس ؛
onMouseout: عندما يتم نقل الماوس ؛
onmousedown: عندما يتم الضغط على الماوس ؛
onMouseup: عندما يتم رفع الماوس ؛
Onclick: عند النقر فوق زر الماوس الأيسر ؛
Ondblclick: عند النقر نقرًا مزدوجًا على زر الماوس الأيسر ؛
2. أحداث لوحة المفاتيح:
OnKeyDown: يحدث عندما يضغط المستخدم على مفتاح على لوحة المفاتيح ؛
OnKeyup: يحدث عندما يطلق المستخدم مفتاح مضغوط ؛
keypress: عندما يستمر المستخدم في الضغط على المفتاح ؛
أحداث Three.html:
Onload: عند تحميل الصفحة ؛
OnUnload: عند إلغاء تثبيت الصفحة ؛
الإجهاض: إذا لم يتم استنساخ المستخدم بالكامل قبل إنهاء عملية التحميل ، فسيحدث حدث الإحباط إذا لم يتم استنساخه بالكامل.
خطأ: الحدث الذي تم إنشاؤه عند حدوث خطأ في JavaScript ؛
SELECT: تم تشغيل الحدث المحدد عندما يحدد المستخدم حرفًا في إدخال أو نص
التغيير: في إدخال أو نص ، عندما يفقد التركيز ، يتم تشغيل حدث التغيير في Select
إرسال: عند تقديم النموذج ، يتم تشغيل حدث إرسال ؛
إعادة تعيين: إعادة تعيين
تغيير الحجم: الحدث الذي يتم تشغيله عند تغيير حجم النافذة أو الإطار ؛
التمرير: الأحداث التي تم إطلاقها عندما يقوم المستخدم بالتمرير أو لديه قضبان التمرير ؛
التركيز: عندما يضيع التركيز ؛
ضبابي: عندما تحصل على التركيز ؛
نموذج حدث JavaScript
1. طراز الحدث JavaScript: 1. نوع الفقاعة: <input type = "button"> عندما ينقر المستخدم على الزر: الإدخال-الجسم--الفتح-Window (فقاعة من الأسفل إلى الأعلى) ، أي متصفح يستخدم فقط الفقاعة
2. نوع الالتقاط: <input type = "button"> عندما ينقر المستخدم على الزر: Window-Document-HTML-Body (من الأعلى إلى الأسفل)
بعد توحيد ECMA ، تدعم المتصفحات الأخرى نوعين ، ويحدث الالتقاط أولاً.
2. ثلاث طرق لكتابة الأحداث التقليدية:
1. <input type = "button" onClick = "Alert ('HelloWorld!')">
2. <إدخال type = "button onClick = name1 ()"> ========== <script> name1 () {Alert ('HelloWord!') ؛} </script> // name function
3. <إدخال type = "button" id = "input1"> // وظيفة مجهولة
نسخة الكود كما يلي:
<script>
var button1 = document.getElementById ("input1") ؛
button1.onclick = الترفيه () {
تنبيه ('helloword!')
}
</script>
3. طريقة كتابة الأحداث الحديثة:
نسخة الكود كما يلي:
<type type = "button" id = "input1"> // إضافة أحداث في IE
<script>
var fnclick () {
تنبيه ("لقد تم النقر عليه")
}
var oinput = document.getElementById ("input1") ؛
oinput.attachevent ("onclick" ، fnclick) ؛
---------------------------------------
oinput.detachevent ("onclick" ، fnclick) ؛ // حذف الحدث في IE
</script>
نسخة الكود كما يلي:
<type type = "button" id = "input1"> // إضافة أحداث في DOM
<script>
var fnclick () {
تنبيه ("لقد تم النقر عليه")
}
var oinput = document.getElementById ("input1") ؛
Oinput.AdDeventListener ("onClick" ، fnclick ، true) ؛
---------------------------------------
Oinput.RemoveeventListener ("Onclick" ، fnclick) ؛ // حذف الحدث في DOM
</script>
نسخة الكود كما يلي:
<type type = "button" id = "input1"> // متوافق مع أحداث إضافة IE و DOM
<script>
var fnclick1 = function () {alert ("لقد تم النقر عليه")}
var fnclick2 = function () {alert ("i splicked")}
var oinput = document.getElementById ("input1") ؛
if (document.attachevent) {
oinput.attachevent ("onclick" ، fnclick1)
oinput.attachevent ("onclick" ، fnclick2)
}
آخر (document.adDeventListener) {
Oinput.AdDeventListener ("Click" ، FnClick1 ، True)
Oinput.AdDeventListener ("Click" ، FnClick2 ، True)
}
</script>