يُعرف التغيير في حالة الكائن باسم حدث . في لغة HTML، هناك العديد من الأحداث التي تمثل أن بعض الأنشطة يتم تنفيذها بواسطة المستخدم أو بواسطة المتصفح. متى جافا سكريبت يتم تضمين التعليمات البرمجية في HTML، وتتفاعل js مع هذه الأحداث وتسمح بالتنفيذ. تسمى عملية التفاعل مع الأحداث هذه التعامل مع الحدث . وبالتالي، يتعامل Js مع أحداث HTML عبر معالجات الأحداث .
جافا للحلقة
على سبيل المثال ، عندما ينقر المستخدم فوق المتصفح، أضف رمز js، الذي سينفذ المهمة التي سيتم تنفيذها في الحدث.
بعض أحداث HTML ومعالجات الأحداث الخاصة بها هي:
أحداث الماوس:
| تم تنفيذ الحدث | معالج الأحداث | وصف |
|---|---|---|
| انقر | عند النقر | عند النقر بالماوس على عنصر |
| تمرير الماوس | على الفأرة فوق | عندما يأتي مؤشر الفأرة فوق العنصر |
| خروج الماوس | com.onmouseout | عندما يترك مؤشر الماوس عنصرا |
| com.mousedown | com.onmousedown | عند الضغط على زر الفأرة فوق العنصر |
| mouseup | com.onmouseup | عندما يتم تحرير زر الماوس فوق العنصر |
| تحرك الماوس | com.onmousemove | عندما تتم حركة الماوس. |
أحداث لوحة المفاتيح:
| تم تنفيذ الحدث | معالج الأحداث | وصف |
|---|---|---|
| مفتاح لأسفل ومفتاح | onkeydown وonkeyup | عندما يقوم المستخدم بالضغط على المفتاح ثم تحريره |
أحداث النموذج:
| تم تنفيذ الحدث | معالج الأحداث | وصف |
|---|---|---|
| ركز | مركز | عندما يركز المستخدم على عنصر ما |
| يُقدِّم | عند تقديم | عندما يرسل المستخدم النموذج |
| طمس | على طمس | عندما يكون التركيز بعيدًا عن عنصر النموذج |
| يتغير | على التغيير | عندما يقوم المستخدم بتعديل أو تغيير قيمة عنصر النموذج |
أحداث النافذة/الوثيقة
| تم تنفيذ الحدث | معالج الأحداث | وصف |
|---|---|---|
| حمولة | تحميل | عندما ينتهي المتصفح من تحميل الصفحة |
| تفريغ | com.onunload | عندما يغادر الزائر صفحة الويب الحالية، يقوم المتصفح بإلغاء تحميلها |
| تغيير الحجم | com.onresize | عندما يقوم الزائر بتغيير حجم نافذة المتصفح |
دعونا نناقش بعض الأمثلة على الأحداث ومعالجاتها.
انقر فوق الحدث
Javascript Eventsاختبره الآن
حدث MouseOver
<p onmouseover="mouseoverevent()"> Keep cursor over me</p>اختبره الآن
حدث التركيز
Javascript Events <h2> Enter something here</h2>اختبره الآن
حدث المفتاح
Javascript Events <h2> Enter something here</h2>اختبره الآن
حدث التحميل
Javascript Events <br>اختبره الآن