این آموزش در تاریخ ۱۴۰۲/۰۶/۲۳ آپدیت شده است.
آموزش رویداد عمومی OnLoad در HTML
سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. لطفا در ادامه با آموزش رویداد عمومی OnLoad در HTML با من همراه باشید.
Free-Learn
آنچه در این جلسه میخوانید :
رویداد عمومی OnLoad در HTML
رویداد onload از اسمشم مشخصه، رویدادی است که در هنگام لود شدن یا بارگذاری شدن یک فایل یا یک صفحه و.. میتواند اجرا شود.
برای مثال اگر این رویداد درون تگ body قرار بگیرد وقتی صفحه بطور کامل لود شد این رویداد اجرا می شود، یا اگر این رویداد درون تگ <img> قرار بگیرد، وقتی یک تصویر بصورت کامل بارگذاری شد این رویداد میتواند اجرا شود.
Free-Learn
مثال از رویداد عمومی onload در HTML
مثال شماره ۱ : استفاده در تگ body برای لود شدن صفحه
|
1 2 3 4 5 6 7 8 9 10 11 |
<body onload="MyMessage();"> <p> سایت آموزشی فری لرن </p> <script> function MyMessage(){ alert("به سایت من خوش اومدی"); } </script> </body> |
مثال شماره ۲ : استفاده در تگ img برای لود شدن تصویر
|
1 2 3 4 5 6 7 8 9 10 11 |
<body> <img src="files/logo.png" onload="MyMessage();"> <script> function MyMessage(){ alert("تصویر با موفقیت لود شد"); } </script> </body> |
Free-Learn
پشتیبانی مرورگرها
در جدول زیر میتوانید مشاهده نمایید که آیا مرورگرهای اینترنتی از رویداد onload در HTML پشتیبانی میکنند یا خیر.
| نام مرورگر | Chrome | Firefox | Opera | Safari | Edge |
| پشتیبانی | بله | بله | بله | بله | بله |
Free-Learn
روش استفاده
روش استفاده از این رویداد در عناصر HTML بصورت زیر می باشد.
|
1 |
<element onload="Script"> |
Free-Learn
جدول مقادیر رویداد onload
در جدول زیر میتوانید مقادیری را که میتوان در این رویداد استفاده کرد را مشاهده نمایید.
| مقدار | توضیح |
| Script | دستورات جاوااسکریپت برای اجرا شدن |
Free-Learn
عناصری که توسط این رویداد پشتیبانی می شوند
رویداد onload را میتوان در عناصر/تگ های زیر بکار برد :
| <body> | <iframe> | <img> |
| <style> | <script> | <link> |
| <input type=”image”> | ||
Free-Learn
نکات و توضیحات
- همونطور که در جدول بالا مشاهده مینمایید خب ما میتونیم از این رویداد در تگ های مختلف استفاده کنیم، ولی خب بهترین گزینه استفاده در تگ body هستش چون اینجوری دیگه وقتی همه چیز ( تصاویر، فایل css و js و.. ) در صفحه لود شد این رویداد میتونه اجرا بشه.
