أحدث البرامج التعليمية وتطوير الشبكة
×

JS البرنامج التعليمي

JS الصفحة الرئيسية JS المقدمة JS ألى أين JS الناتج JS بناء الجملة JS البيانات JS تعليقات JS المتغيرات JS مشغلي JS علم الحساب JS مهمة JS أنواع البيانات JS وظائف JS الأجسام JS نطاق JS أحداث JS سلاسل JS طرق سلسلة JS أرقام JS طرق عدد JS الرياضيات JS التمور JS تاريخ تنسيقات JS تاريخ طرق JS المصفوفات JS طرق مجموعة JS القيم المنطقية JS مقارنات JS الظروف JS تحول JS حلقة غيرمنتهية For JS حلقة بينما JS استراحة JS نوع التحويل JS التعبير العادي JS أخطاء JS التصحيح JS الرفع JS الوضع الصارم JS دليل الاناقة JS أفضل الممارسات JS الأخطاء JS أداء JS الكلمات المحجوزة JS JSON

JS أشكال

أشكال التحقق من صحة API أشكال

JS موضوع

تعريفات الكائن خصائص الكائن طرق كائن نماذج الكائن

JS وظائف

تعاريف وظيفة وظيفة المعلمات وظيفة الاحتجاج الإغلاق وظيفة

JS HTML DOM

DOM مقدمة DOM أساليب DOM وثيقة DOM عناصر DOM HTML DOM CSS DOM الرسوم المتحركة DOM أحداث DOM EventListener DOM ملاحة DOM العقد DOM Nodelist

JS المتصفح BOM

JS Window JS Screen JS Location JS History JS Navigator JS Popup Alert JS Timing JS Cookies

JS أمثلة

JS أمثلة JS HTML DOM JS HTML إدخال JS HTML الأجسام JS HTML أحداث JS المتصفح JS اختبار قصير JS ملخص

JS المراجع

JavaScript الأجسام HTML DOM الأجسام


 

JavaScript أحداث

❮ السابق التالي الفصل ❯

أحداث HTML هي "الأشياء" التي تحدث لعناصر HTML.

عندما يتم استخدام جافا سكريبت في صفحات HTML و JavaScript يمكن أن "رد فعل" على هذه الأحداث.

HTML الأحداث

يمكن أن يكون حدثا HTML شيء المتصفح لا، أو شيء من هذا المستخدم لا.

وفيما يلي بعض الأمثلة على الأحداث HTML:

  • صفحة ويب HTML انتهت تحميل
  • تم تغيير حقل إدخال HTML
  • تم النقر على زر HTML

في كثير من الأحيان، عندما تحدث أحداث، قد تريد أن تفعل شيئا.

جافا سكريبت تمكنك من تنفيذ التعليمات البرمجية عندما يتم الكشف عن الأحداث.

HTML يسمح سمات معالج الحدث، مع شفرة جافا سكريبت، لتضاف إلى عناصر HTML.

مع علامات الاقتباس المفردة:

< some-HTML-element some-event = ' some JavaScript ' >

مع التنصيص:

< some-HTML-element some-event = " some JavaScript " >

في المثال التالي، onclick ، يضاف سمة (مع رمز) إلى عنصر الزر:

مثال

<button onclick='getElementById("demo").innerHTML=Date()'>The time is?</button>
انها محاولة لنفسك »

في المثال أعلاه، يتغير شفرة جافا سكريبت محتوى عنصر مع id="demo" .

في المثال التالي، تغيير رمز محتوى العنصر الخاص بها (باستخدام this .innerHTML ):

مثال

<button onclick="this.innerHTML=Date()">The time is?</button>
انها محاولة لنفسك »

كود جافا سكريبت في كثير من الأحيان العديد من خطوط طويلة. وهو أكثر شيوعا لمعرفة سمات الحدث تطلق على وظائف:

مثال

<button onclick="displayDate()">The time is?</button>
انها محاولة لنفسك »

HTML المشتركة الأحداث

وهنا لائحة من بعض الأحداث HTML المشتركة:

حدث وصف
onchange تم تغيير عنصر HTML
onclick قيام المستخدم بالنقر فوق عنصر HTML
onmouseover المستخدم بتحريك الماوس فوق عنصر HTML
onmouseout المستخدم بتحريك الماوس بعيدا عن عنصر HTML
onkeydown المستخدم يدفع مفتاح لوحة المفاتيح
onload الانتهاء من المتصفح تحميل الصفحة

والقائمة أطول من ذلك بكثير: w3ii جافا سكريبت المرجعي HTML DOM الأحداث .

ما يمكن أن جافا سكريبت تفعل؟

معالجات الأحداث يمكن استخدامها للتعامل، والتحقق، ومدخلات المستخدم، إجراءات المستخدم، والإجراءات المتصفح:

  • الأشياء التي ينبغي القيام به في كل مرة تحميل الصفحة
  • الأشياء التي ينبغي القيام به عندما تكون الصفحة مغلقة
  • الإجراءات التي يجب أن يؤديها عندما ينقر المستخدم على زر
  • المحتوى الذي ينبغي التحقق منها عندما بيانات مدخلات المستخدم
  • و اكثر ...

العديد من الطرق المختلفة التي يمكن أن تستخدم للسماح عمل جافا سكريبت مع الأحداث:

  • يمكن سمات الحدث HTML تنفيذ شفرة جافا سكريبت مباشرة
  • يمكن سمات الحدث HTML استدعاء وظائف جافا سكريبت
  • يمكنك تعيين الخاصة وظائف معالج الأحداث لعناصر HTML
  • يمكنك منع الأحداث من إرسالها أو يجري التعامل معها
  • و اكثر ...

سوف تتعلم الكثير عن الأحداث ومعالجات الأحداث في HTML DOM فصول.

اختبر نفسك مع تمارين!

التمرين 1 » التمرين 2» التمرين 3 »


❮ السابق التالي الفصل ❯