یک رویداد چیست؟

تعامل جاوا اسکریپت با HTML از طریق رویدادهایی (events) صورت می پذیرد. رویدادها وقتی رخ می دهند که کاربر یا مرورگر یک صفحه را دستکاری می نماید.

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

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

رویدادها بخشی از Document Object Model (DOM) سطح 3 می باشند و هر عنصر HTML شامل مجموعه ای از رویدادها می باشد ، که این رویدادها می توانند کدهای جاوا اسکریپت را راه اندازی کنند.

رویداد Onclick

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

مثال:

مثال زیر را امتحان نمایید:

<html>
   <head>   
      <script type = "text/javascript">
         <!--
            function sayHello() {
               alert("Hello World")
            }
         //-->
      </script>      
   </head>
   
   <body>
      <p>Click the following button and see result</p>      
      <form>
         <input type = "button" onclick = "sayHello()" value = "Say Hello" />
      </form>      
   </body>
</html>

خروجی:

خروجی کد فوق به این صورت است:

Hello World

رویداد Onsubmit

Onsubmit ، رویدادی است که هنگامی که کاربر سعی در ثبت یک فرم می نماید ، رخ می دهد. ما می توانیم رویداد اعتبارسنجی را در برابر این رویداد اعمال نماییم.

مثال:

مثال زیر نحوه استفاده از رویداد Onsubmit را نشان می دهد. در اینجا ، ما تابع  validate() را قبل از ارسال داده های یک فرم به وب سرور فراخوانی می کنیم.  اگر تابع validate() مقدار true را باز گرداند ، فرم به وب سرور ارسال خواهد شد ، در غیر این صورت ، داده ها ارسال نمی شوند.

مثال زیر را امتحان نمایید:

<html>
   <head>   
      <script type = "text/javascript">
         <!--
            function validation() {
               all validation goes here
               .........
               return either true or false
            }
         //-->
      </script>      
   </head>
   
   <body>   
      <form method = "POST" action = "t.cgi" onsubmit = "return validate()">
         .......
         <input type = "submit" value = "Submit" />
      </form>      
   </body>
</html>

رویداد onmouseover و onmouseout

این دو نوع رویداد به ما کمک خواهند کرد که افکت های زیبایی با تصاویر یا حتی با متن ها بسازیم. رویداد onmouseover ، وقتی راه اندازی می شود که اشاره گر موس روی هر عنصری برده شود و رویداد onmouseout وقتی راه اندازی می شود که اشاره گر موس از روی عنصر موردنظر کنار کشیده شود. مثال زیر را امتحان نمایید:

<html>
   <head>   
      <script type = "text/javascript">
         <!--
            function over() {
               document.write ("Mouse Over");
            }            
            function out() {
               document.write ("Mouse Out");
            }            
         //-->
      </script>      
   </head>
   
   <body>
      <p>Bring your mouse inside the division to see the result:</p>      
      <div onmouseover = "over()" onmouseout = "out()">
         <h2> This is inside the division </h2>
      </div>         
   </body>
</html>

خروجی:

خروجی حاصل از اجرای کد فوق به صورت زیر می باشد:

:Bring your mouse inside the division to see the result

This is inside the division

رویدادهای استاندارد HTML 5

در ادامه ، رویدادهای استاندارد HTML 5 به عنوان مرجع برای شما فهرست شده اند. در اینجا ، script نشان دهنده یک تابع جاوا اسکریپت برای اجرا در برابر آن رویداد می باشد.

صفت مقدار توضیحات
Offline Script زمانی که document به صورت آفلاین اجرا می شود ، راه اندازی می شود
Onabort Script در هنگام اجرای رویداد abort (بی نتیجه) ، راه اندازی می شود.
Onafterprint Script بعد از این که سندی چاپ شود ، راه اندازی می شود.
onbeforeonload Script قبل از این که سندی لود شود ، راه اندازی می شود.
onbeforeprint Script قبل از این که سندی چاپ شود ، راه اندازی می شود.
Onblur Script هنگامی که پنجره ای تمرکز را از دست دهد ، راه اندازی می شود.
Oncanplay Script زمانی که رسانه ای شروع به پخش نماید ، راه اندازی می شود ، اما باید عملیات بافرینگ متوقف شود.
Oncanplaythrough Script زمانی که رسانه می تواند تا انتها پخش شود ، بدون این که عملیات بافرینگ متوقف شود ، راه اندازی می شود.
Onchange Script هنگامی که یک عنصر تغییر می یابد ، راه اندازی می شود.
Onclick Script هنگامی که یک کلیک موس انجام می شود ، راه اندازی می شود.
Oncontextmenu Script هنگامی که یک منو context فعال می شود ، راه اندازی می شود.
Ondblclick Script هنگامی که دابل کلیک موس انجام می شود ، راه اندازی می شود.
Ondrag Script هنگامی که یک عنصر درک می شود ، راه اندازی می شود.
Ondragend Script در انتهای عملیات درگ کردن راه اندازی می شود.
ondragenter Script هنگامی که یک عنصر درگ شده به یک هدف درست drop می شود ، راه اندازی می شود.
ondragleave Script هنگامی که یک عنصر در حال درگ از روی یک هدف drop درست عبور می کند ، راه اندازی می شود.
Ondragover Script در شروع یک عملیات درگ راه اندازی می شود.
Ondragstart Script در شروع یک عملیات درگ راه اندازی می شود.
Ondrop Script در هنگامی که یک عنصر درگ شده در حال drop شدن است ، راه اندازی می شود.
Ondurationchange Script زمانی که طول رسانه تغییر یابد ، راه اندازی می شود.
Onemptied Script هنگامی که یک عنصر رسانه منبع به طور ناگهانی خالی می شود ، راه اندازی می شود.
Onended Script زمانی که رسانه به انتها می رسد ، راه اندازی می شود.
Onerror Script زمانی که یک خطا رخ می دهد ، راه اندازی می شود.
Onfocus Script زمانی که یک پنجره تمرکز را دریافت می کند ، راه اندازی می شود.
Onformchange Script زمانی که یک فرم تغییر می یابد ، راه اندازی می شود.
Onforminput Script زمانی که یک فرم ورودی کاربر را می گیرد ، راه اندازی می شود.
Onhaschange Script زمانی که یک سند تغییر می یابد ، راه اندازی می شود.
Oninput Script زمانی که یک عنصر ورودی کاربر را می گیرد ، راه اندازی می شود.
Oninvalid Script زمانی که یک عنصر نامعتبر محسوب می شود ، راه اندازی می شود.
Onkeydown Script زمانی که یک کلید فشار داده می شود ، راه اندازی می شود.
Onkeypress Script زمانی که یک کلید فشار داده شده و رها می شود ، راه اندازی می شود.
Onkeyup Script زمانی که یک کلید رها می شود ، راه اندازی می شود.
Onload Script زمانی که سند لود می شود ، راه اندازی می شود.
Onloadeddata Script زمانی که داده های رسانه لود شوند ،  راه اندازی می شود.
Onloadedmetadata Script زمانی که مدت زمان و سایر داده های رسانه از عنصر media لود شوند ، راه اندازی می شود.
Onloadstart Script زمانی که مروگر شروع به لود داده های رسانه نماید ، راه اندازی می شود.
Onmessage Script زمانی که یک پیام فعال شود ، راه اندازی می شود.
Onmousedown Script زمانی که یک کلید موس فشار داده شود ، راه اندازی می شود.
Onmousemove Script زمانی که اشاره گر موس حرکت کند ، راه اندازی می شود.
Onmouseout Script زمانی که اشاره گر موس خارج از یک عنصر حرکت می کند ، راه اندازی می شود.
Onmouseover Script زمانی که اشاره گر موس بر روی یک عنصر حرکت می کند ، راه اندازی می شود.
Onmouseup Script هنگامی که یک کلید موس رها می شود ، راه اندازی می شود.
Onmousewheel Script هنگامی که غلتک موس شروع به گردش می نماید، راه اندازی می شود.
Onoffline Script زمانی که سند به صورت آفلاین اجرا می شود ، راه اندازی می شود.
Onoine Script هنگامی که سند آنلاین باشد ، راه اندازی می شود.
Ononline Script هنگامی که سند آنلاین باشد ، راه اندازی می شود.
Onpagehide Script هنگامی که پنجره مخفی می شود ، راه اندازی می شود.
Onpageshow Script هنگامی که پنجره قابل مشاهده می شود ، راه اندازی می شود.
Onpause Script هنگامی که داده های رسانا paused می شود ، راه اندازی می شود.
Onplay Script هنگامی که داده های رسانه در حال شروع به پخش شدن هستند ، راه اندازی می شود.
Onplaying Script هنگامی که داده های رسانه شروع به پخش می شود ، راه اندازی می شود.
Onpopstate Script هنگامی که پنجره history تغییر می کند ، راه اندازی می شود.
Onprogress Script هنگامی که مرورگر در حال واکشی داده های رسانه می باشد ، راه اندازی می شود.
Onratechange Script هنگامی نرخ پخش داده های رسانه تغییر می یابد ، راه اندازی می شود.
Onreadystatechange Script هنگامی که وضعیت آماده (read-state) تغییر می یابد ، راه اندازی می شود.
Onredo Script هنگامی که یک سند یک عمل redo را اجرا می کند ، راه اندازی می شود.
Onresize Script هنگامی که یک پنجره تغییر اندازه می شود ، راه اندازی می شود.
Onscroll Script هنگامی که یک عنصر scrollbar در حال scroll باشد ، راه اندازی می شود.
Onseeked Script در زمانی که صفت عنصر جستجوی رسانه درست نباشد ، عملیات جستجو پایان یابد ، راه اندازی می شود.
Onseeking Script در زمانی که صفت عنصر جستجوی رسانه درست باشد ، عملیات جستجو شروع شود ، راه اندازی می شود.
Onselect Script هنگامی که یک عنصر جستجو شود ، راه اندازی می شود.
Onstalled Script هنگامی که یک خطا در واکشی داده های رسانه بروز نماید ، راه اندازی می شود.
Onstorage Script هنگامی که یک سند لود می شود ، راه اندازی می شود.
Onsubmit Script هنگامی که یک فرم ثبت می شود ، راه اندازی می شود.
Onsuspend Script هنگامی که مرورگر داده های رسانه را واکشی کرده باشد ، اما قبل از این که کل فایل رسانه واکشی شده باشد ، متوقف شود ، راه اندازی می شود.
Ontimeupdate Script هنگامی که رسانه موقعیت پخش خود را تغییر می دهد ، راه اندازی می شود.
Onundo Script هنگامی که یک سند یک عملیات undo را اجرا نماید ، راه اندازی می شود.
Onunload Script هنگامی که کاربر از یک سند خارج شود ، راه اندازی می شود.
Onvolumechange Script هنگامی که رسانه ای صدا را تغییر می دهد ، و هم چنین صدا به حالت “mute” تنظیم شود ، راه اندازی می شود.
onwaiting Script هنگامی که حالت پخش رسانه متوقف می شود ، اما انتظار ادامه (resume) پخش وجود دارد ، راه اندازی می شود.