دستورات پنجره Pop up در جاوا اسکریپت
چقدر از Pop up در جاوا اسکریپت اطلاع دارید؟ آیا می دانید Pop up در جاوا اسکریپت چه ویژگی دارد؟
می دانید که جاوا اسکریپت یک زبان سرور کاربر است که اصطلاً به آن زبان client-side گفته می شود. در واقع این زبان در مرورگر کاربر اجرا می شود و با استفاده از مفسر آن به طور دقیق پردازش ها صورت می گیرد. حال اگر شما به عنوان یک برنامه نویس فعالیت می کنید چه خوب است به توانید قابلیت های پرکاربرد جاوا اسکریپت را به درستی مورد بررسی قرار دهید. Pop up در جاوا اسکریپت یکی از قابلیت های بسیار مهم محسوب می شود در واقع پاپ آپ ها همان پنجره های کوچک برای نمایش محسوب می شوند که خود دارای دسته بندی مختلفی می باشد.(توصیه می شود دوره آموزشی طراحی سایت و پکیج آموزش طراحی سایت را مشاهده کنید)
مشخصات Pop up در جاوا اسکریپت
قبل از اینکه که روند برنامه نویسی Pop up در جاوا اسکریپت را یاد بگیریم باید به طور دقیق برایمان شفاف سازی شود که Pop up در جاوا اسکریپت چیست و چه کاربردی دارد؟
پاپ آپ در برنامه نویسی یک پنجره کوچک است که می توان با دخالت کاربر و یا به صورت خودکار در مرورگر نمایش داده شود. موضوع را با یک مثال شفاف سازی می کنیم. فرض کنید شما یک سایت را باز می کنید و به طور ناخودآگاه یک تبلیغ و یا پیام خوشامدگویی به شما نشان داده می شود تمامی این موارد به کمک آپشن Pop up در جاوا اسکریپت است. البته گاهاً این روند بر اساس کلیک کاربر و یا اشاره ماوس آن صورت می گیرد. پاپ آپ ها در لیست GUI ها قرار دارد و به آنها واسط کاربر گرافیکی گفته می شود. در واقع این آپشن سبب می شود که قابلیت تعامل با کاربران به طور دقیق صورت بگیرد.
دستور alert در Pop up جاوا اسکریپت
اولین دستوری که در لیست خانواده Pop up در جاوا اسکریپت قرار می گیرد آلرت است ک در واقع به این صورت کار می کند که یک پیام به کاربر نشان داده می شود و به همان پیام یک دکمه نیز وجود دارد که کاربر می بایست آن را تأیید نماید. یکی دیگر از ویژگی های خوب دستور آلرت خطایابی است در واقع برنامه نویسان در زمان خروجی گرفتن می توانند با کمک این دستور خطاهایی که در کدها وجود دارند را برطرف سازند. یک قطعه کد ساده می نویسم تا این موضوع کمی شفاف سازی شود. مثلاً فرض کنید که یک آرایه دارید و قرار است که متغیر به نام alert تعریف شود با نوشتن این کد و خروجی گرفتن روند کار با Pop up در جاوا اسکریپت بهتر برای شما شفاف سازی می شود.
1 2 3 4 5 |
<script type="text/javascript"> alert("سلام! به آموزش جاوا اسکریپت خوش آمدید"); </script> |
دستور confirm در Pop up جاوا اسکریپت
حال نوبت به بررسی یک دستور دیگر از گروه Pop up در جاوا اسکریپت است. دستور کانفرم در واقع به معنی تصدیق و تایید است و به طور کلی در جنبه های مثبت استفاده می شود. با استفاده از این دستور در واقع کاربر مشخص می سازد که آیا می خواهند یک کار انجام شود و یا صورت نپذیرد. پس از اینکه این دستور اجار شود به کاربر یک پنجره نمایش داده می شود که در واقع مشابه با یک هشدار است و اگر کاربر موافق باشد می بایست بر روی ok کلیک نماید.
مبرهن است که در کدنویس در این فضا نیاز است که به طور دقیق از مقدار یک برای true و مقدار صفر برای fulse استفاده شود. این موضوع را با یک مثال به طور دقیق تر توضیح می دهیم. فرض کنید شما یک سیستم نوشته اید که در آن قرار است مدیر پیام های کاربران را که حالت ناخواسته دارد حذف نماید در چنین حالتی می توان از دستور کانفرم استفاده نمود. این روش به نوبه خود یک روش اطمینان سنجی محسوب شود که در سمت سرور صور می گیرد.
قطعه کدی نوشته ایم تا شما نیز دست به کار شوید و برنامه نویسی را آغاز کنید:
توجه: جایی که از ستاره (*) استفاده شده است در واقع باید سایت مورد نظر شما قرار بگیرد که می تواند هر اسم معتبری باشد.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 |
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.****.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.***/.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title> | دستور confirm در جاوا اسکریپت</title> <!-- https://*******.ir --> <style type="text/css"> body{ font-family:Tahoma, Geneva, sans-serif; font-size:12px; direction:rtl; } </style> </head> <body> <script type="text/javascript"> function confirmed(){ var check = confirm("آیا حذف این پیام را تایید می کنید؟"); if (check == 1){ document.getElementById('text').innerHTML = ''; alert("پیام حذف شد"); } else{ document.getElementById('text').innerHTML = 'در صورت تایید، این پیام حذف خواهد شد'; alert("حذف پیام لغو شد"); } } </script> <div id="text">در صورت تایید، این پیام حذف خواهد شد</div> <input type="button" value="تایید" onclick="confirmed()" /> </body> </html> |
دستور window.open در Pop up جاوا اسکریپت
این دستور نیز در لیست Pop up در جاوا اسکریپت قرار دارد و به نوعی برای فراخوانی یک لینک در صفحه جدید مورد استفاده قرار می گیرد البته لینک مورد نظر می تواند در همان صفحه نیز فراخوانی شود. به عنوان مثال در سال بخشی برای نظرات وجود دارد که در قالب یک پنجره کوچک و جدید می باشد گاهاً از این امکان استفاده های نادرست می شود و در زمینه پنجره های تبلیغاتی از آن استفاده می شود و مسدودیت ایجاد می کند( این موضوع از مقاله ما خارج است)
در زیر یک مثال اعمال شده است تا دستور مورد نظر به طور دقیق تری مشخص شود.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 |
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.****.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.****.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title> | کاربرد Pop-up در جاوا اسکریپت</title> <!-- https://*****.ir --> <style type="text/css"> body{ font-family:Tahoma, Geneva, sans-serif; font-size:12px; direction:rtl; } </style> </head> <body> <script type="text/javascript"> function WinOpen(){ var url = "https://****.ir"; window.open(url, | آموزش برنامه نویسی و مهارتهای وب', "height=600, width=800, resizable=1, left=0, top=0, status=1, scrollbars=yes"); } </script> <input type="button" value="پنجره جدید" onclick="WinOpen()" /> </body> </html> |
منبع : طراحی سایت