پنجره های ارتباط با کاربر
popup boxes
سه نوع پنجره در جاوااسکريپت وجود دارند که مي
توانيد توسط آنها پيغامي را در صفحه براي کاربر نمايش دهيد و يا اطلاعاتي
براي تأييد آنها بفرستيد و يا اينکه اطلاعاتي را از آنها بخواهيد. آنها پنجره
هاي کوچکي هستند که چون خيلي سريع در صفحه بالا آمده و در مقابل کاربر ظاهر
مي شوند، به آنها popup گفته مي شود.
اين پنجره ها عبارتند از: پنجره
alert ، پنجره confirm
و پنجره prompt .
پنجره Alert
پنجره alert ، حاوي يک
اخطاريه براي کاربر است که در آن هشداري داده مي شود تا کاربر متوجه کاري که
مي کند باشد. دستور اين پنجره به صورت زير است:
alert (" text ")
اين پنجره فقط داراي يک دکمه
OK است که کاربر بعد از خواندن آن اخطاريه با زدن
دکمه ok ، پنجره را مي بندد.
<html>
<head>
<script type="text/javascript" type="text/javascript">
function alertbox ( )
{
alert ( "
This is an Alert box! " )
}
</script>
</head>
<body>
<form>
<input type="button" onclick="alertbox (
)" value="Click here">
</form>
</body>
</html>
اجراي کد
پنجره Confirm
اين مدل پنجره ، همانطور که از اسمش پيداست براي
گرفتن تأييد از کاربر اجرا مي شود. اين پنجره داراي دو دکمه
OK و Cancel مي باشد که
با زدن دکمه OK توسط کاربر مقدار
true بازگردانده مي شود و با زدن
Cancel مقدار false
برگردانده مي شود. دستور اين پنجره به اين صورت است:
confirm ( " text " )
اين پنجره براي مواقعي خوب است که شما نياز به
جواب کاربر براي ادامه مطلبي يا چيزي داريد، در صورتيکه کاربر تأييد کند آن
مطلب ادامه پيدا مي کند و در غير اينصورت همانجا متوقف خواهد شد.
<html>
<head>
<script type="text/javascript" type="javascript">
function confirmbox ( )
{
var button = confirm (" press a button.")
if (button == true)
{
document.write (" You pressed OK button. ")
}
else
{
document.write (" You pressed Cancel button.")
}
}
</script>
</head>
<body onload="confirmbox()">
</body>
</html>
اجراي کد
در اين اسکريپت ما ابتدا يک تابع در قسمت
head تعريف کرديم سپس دستور
confirm را در يک متغير بنام button ذخيره
کرديم تا بتوانيم براي اين متغير شرطي را تعيين کنيم. همانطور که گفتيم اگر
کاربر دکمه OK را بزند، مقدار
true برگردانده مي شود پس شرط را بر اين روال گرفتيم که اگر مقدار
true بازگردانده شد متني در صفحه چاپ شود و در غير
اينصورت متني ديگر نوشته شود. سپس اين تابع را در تگ بدنه و در رويداد
onload قرار داديم تا به محض باز شدن صفحه پنجره
confirm اجرا شود. رويداد
onload را در بخش بعدي ياد خواهيد گرفت.
پنجره prompt
از اين پنجره زماني استفاده مي شود که شما نياز
داشته باشيد تا اطلاعاتي را از کاربر دريافت کنيد و آنرا در جايي مناسب
بازگردانيد. معمولاً اجراي اين پنجره هنگام باز شدن صفحه وب است و داراي دو
قسمت يا دو پارامتر مي باشد:
prompt ( "text or question",
" default value " )
در قسمت اول يک متن که معمولاً سؤال است را وارد
مي کنيد تا در پنجره ظاهر شود و در قسمت دوم يک مقدار پيش فرض براي راهنمايي
کاربر وارد مي کنيد که معمولاً آن قسمت را خالي مي گذارند تا کاربر آن مقدار
را وارد نمايد. البته اگر هم شما مقدار پيش فرض را وارد نماييد، باز کاربر
قادر به وارد کردن مقدار ميباشد.
<html>
<head>
<script type="text/javascript">
function promptbox ( )
{
var name=prompt("Please enter your name", "name...")
if (name!=null && name!="")
{
document.write("Hello " + name + " and welcome to this
page.")
}
}
</script>
</head>
<body onload="promptbox()">
</body>
</html>
اجراي کد
مانند مثال قبل عمل کرديم با اين تفاوت که اين
بار از دستور prompt استفاده شده است. فقط به يک
نکته دقت کنيد که در دستور شرط ما متغير name را
نا مساوي با مقدار null قرار داديم.
null به معني هيچ چيز ميباشد و در اينجا آنرا بکار
گرفتيم تا اگر کاربر بعد از باز شدن پنجره دکمه cancel
را زد و يا هيچ اسمي وارد نکرد تغييري در صفحه ايجاد نشود. شما مي توانيد
يکبار آنرا حذف کنيد و نتيجه اجراي کد را ببينيد.
در حال حاضر شما سه نوع پنجره ارتباط با کاربر را
فرا گرفتيد که دو مدل اول بيشترين کاربرد را در کدنويسي شما خواهند داشت.
ابتداي صفحه
نسخه چاپي اين صفحه
|
