دوره‌ها / JavaScript / رویدادها (Events)

رویدادها (Events)

20 دقیقه Article

واکنش به اتفاقات: رویدادها (Events) ⚡

رویدادها "اتفاقاتی" هستن که برای عناصر HTML می‌افتن. جاوااسکریپت می‌تونه گوش به زنگ باشه و وقتی این اتفاقات افتاد، واکنشی نشون بده.

رویدادهای پرطرفدار:

  • onclick: کاربر روی المنت کلیک کرد.
  • onchange: محتوای یک اینپوت تغییر کرد.
  • onmouseover: کاربر ماوس رو برد روی المنت.
  • onmouseout: کاربر ماوس رو از روی المنت برداشت.
  • onkeydown: یک کلید روی کیبورد فشار داده شد.
  • onload: صفحه کامل لود شد.

مثال: اجرای کد با کلیک دکمه

<button onclick="this.innerHTML = 'مرسی که کلیک کردی!';">کلیک کن!</button>
بهینه‌سازی: به جای نوشتن کدهای طولانی داخل تگ HTML، بهتره یک تابع در فایل JS بنویسید و اون تابع رو در رویداد صدا بزنید: onclick="myFunction()".

تمرین‌های عملی

برای تثبیت یادگیری این درس تمرین‌های زیر را حل کنید

تشخیص نام رویداد Easy
سوال تمرین

نام رویدادی که هنگام کلیک کردن روی یک دکمه اتفاق می‌افتد چیست؟ (پاسخ را به صورت رشته برگردانید).

پاسخ تمرین
JAVASCRIPT
function getClickEventName() {
  return 'onclick';
}

آماده رفتن به درس بعدی هستید؟

این درس را به پایان رساندید و می‌توانید به درس بعدی بروید.