HTML
(کدهای قابل ویرایش آنلاین)
CSS
(کدهای قابل ویرایش آنلاین)
JS
(بدون قابلیت ویرایش آنلاین)
رویدادهای جاوا اسکریپت

رویدادهای جاوا اسکریپت

ارسال شده توسط: پردیس ساتیاری

رویدادهای جاوا اسکریپت اقدامات یا رویه های خاصی هستند که در برنامه یا وب سایتی که در حال ساخت آن هستید اتفاق می افتد. می توانید پاسخی تنظیم کنید که با رویدادهای مشخص ایجاد شود. به عنوان مثال ، رویدادهای ماوس جاوا اسکریپت به حرکات مکان نما مختلف بر روی عناصر اشاره دارد.

در این آموزش ، شما یاد می گیرید که برنامه های رویداد JavaScript، نحوه ایجاد رویدادهای JavaScript و نحوه افزودن رویدادهای دکمه JavaScript و رویدادهای مرورگر چیست. همچنین خواهید فهمید که چگونه ، چرا و در کجا می توانید با JavaScript رویدادهایی را برای افزایش کیفیت سایت خود ، صیقلی تر و کاربرپسندتر کردن آن اضافه کنید.

نکات اصلی رویدادهای جاوا اسکریپت:

  • هر اتفاقی که برای یک عنصر HTML با استفاده از JavaScript رخ دهد ، یک رویداد JavaScript نامیده می شود.
  • جاوا اسکریپت می تواند برخی از کدهای خاص را هنگام وقوع یک رویداد خاص اجرا کند.
  • یک رویداد JavaScript می تواند کاری باشد که کاربر انجام می دهد (به عنوان مثال ، کلیک بر روی عنصر HTML) یا کاری است که یک مرورگر انجام می دهد (به عنوان مثال ، اتمام بارگیری صفحه).

رویدادها: چه زمانی و چه زمانی؟

به خاطر داشته باشید که ویژگی های رویداد HTML می توانند JavaScript را مستقیماً یا از طریق یک تابع اجرا کنند. توابع می توانند و باید توسط شما ایجاد شوند. به این ترتیب آنها بهترین نیازهای شما را برآورده می کنند.

همچنین می توانید از رسیدگی به حوادث JavaScript جلوگیری کنید. وقتی می خواهید عملکرد خاصی را هنگام تغییر چیزی در صفحه وب اجرا کنید ، کنترل کننده های رویداد JavaScript می توانند مفید باشند.

این ها متداول ترین رویدادهای صفحه وب هستند:

  • یک صفحه بارگیری می شود
  • کاربر یک دکمه را کلیک می کند
  • داده های ورودی کاربر

ویژگی های کنترل کننده رویداد

ویژگی های کنترل کننده رویداد JavaScript را می توان در عناصر HTML قرار داد. در مثال زیر می توانید یکی از ساده ترین رویدادهای دکمه JavaScript را مشاهده کنید. ویژگی onclick کنترل کننده رویداد JavaScript به عنصر دکمه HTML اضافه می شود.

وقتی کاربر دکمه را کلیک می کند ، یک رویداد JavaScript رخ می دهد. همچنین ، کد مشخص می کند که هنگام وقوع آن رویداد چه باید کرد:

<button onclick="document.getElementById('dateOut').innerHTML = Date()">What is the time</button>

معمولاً کدی که روی رویداد اجرا می شود از یک خط بیشتر است. در این صورت ، استفاده از توابع راحت تر است:

<button onclick="myFunction()">What is the time</button>

رویدادهای مشترک

رویدادهای جاوا اسکریپت زیادی وجود دارد که وب سایت شما را پویا و زیبا می کند. با این حال ، مانند هر زبان برنامه نویسی ، برخی از توابع از محبوبیت بیشتری نسبت به بقیه برخوردار هستند زیرا در متن مناسب تر و مناسب ترند. به عنوان مثال ، رویدادهای ماوس جاوا اسکریپت شامل مواردی است که مکان نما روی عناصر حرکت می کند ، روی یک تصویر کلیک می شود یا حرکت می کند.

در اینجا لیستی از رایج ترین رویدادهای جاوا اسکریپت (ابزارهایی که عملکرد JavaScript را تحریک می کنند) است:

DescriptionJavaScript Event Handlers
هنگام تغییر یک عنصر HTML رخ می دهدonchange
وقتی کاربر روی عنصر HTML کلیک می کند ، رخ می دهدonclick
زمانی رخ می دهد که کاربر نشانگر خود را روی یک عنصر HTML قرار دهدonmouseover
زمانی اتفاق می افتد که کاربر نشانگر خود را دور از یک عنصر HTML قرار دهدonmouseout
وقتی کاربر یک کلید صفحه کلید را فشار می دهد ، رخ می دهدonkeydown
وقتی بارگیری صفحه وب فعلی رخ می دهدonload

خلاصه رویدادهای جاوا اسکریپت:

  • رویدادهای جاوا اسکریپت هنگام اجرای کد JS به دلیل برخی اقدامات انجام شده رخ می دهد.
  • کنترل کننده های رویداد JavaScript درعناصر HTML پیاده سازی می شوند. می توانید اطلاعات بیشتر در مورد آموزش عناصر HTML را مطالعه کنید.
  • اقدامات تحریک کننده رویدادها در JavaScript توسط کاربر یا مرورگر انجام می شود.