جاوا اسکریپت – Dialog Box ها
JavaScript سه نوع مهمی از Dialog Boxes را پشتیبانی میکند. این Dialog Boxes میتوانند برای اعلام یک هشدار، یا برای دریافت تأییدیه از هر ورودی یا برای دریافت نوعی ورودی از کاربران استفاده شوند. در ادامه هر Dialog Boxes را مفصل بررسی خواهیم کرد.
Alert Dialog Box
Alert Dialog Box عمدتاً برای ارسال پیام هشدار به کاربران استفاده میشود. به عنوان مثال، اگر یک فیلد ورودی نیاز به وارد کردن متنی داشته باشد اما کاربر هیچ ورودیای ارائه ندهد، در این صورت برای اعتبارسنجی میتوانید از یک Alert Dialog Box برای ارسال پیام هشدار استفاده کنید.
با این حال، هنوز میتوان از Alert Dialog Box برای پیامهای friendlier استفاده کرد. Alert Dialog Box تنها یک دکمه “تأیید” برای انتخاب و پیشروی دارد.
مثال
<html>
<head>
<script type = "text/javascript">
<!--
function Warn() {
alert ("این یک پیام هشدار است!");
document.write ("این یک پیام هشدار است!");
}
//-->
</script>
</head>
<body>
<p>روی دکمه زیر کلیک کنید تا نتیجه را ببینید: </p>
<form>
<input type = "button" value = "کلیک کنید" onclick = "Warn();" />
</form>
</body>
</html>
Confirmation Dialog Box
Confirmation Dialog Box عمدتاً برای دریافت موافقت کاربر در هر گزینه استفاده میشود. Confirmation Dialog Box با دو دکمه نمایش میدهد: تأیید و لغو.
اگر کاربر روی دکمه تأیید کلیک کند، روش confirm() پنجره true را برمیگرداند. اگر کاربر روی دکمه لغو کلیک کند، سپس confirm() false را برمیگرداند. میتوانید از یک Confirmation Dialog Box به صورت زیر استفاده کنید:
<html>
<head>
<script type = "text/javascript">
<!--
function getConfirmation() {
var retVal = confirm("آیا میخواهید ادامه دهید؟");
if( retVal == true ) {
document.write ("کاربر میخواهد ادامه دهد!");
return true;
} else {
document.write ("کاربر نمیخواهد ادامه دهد!");
return false;
}
}
//-->
</script>
</head>
<body>
<p>روی دکمه زیر کلیک کنید تا نتیجه را ببینید: </p>
<form>
<input type = "button" value = "کلیک کنید" onclick = "getConfirmation();" />
</form>
</body>
</html>
Prompt Dialog Box
Prompt Dialog Box بسیار مفید است زمانی که میخواهید یک جعبه متنی را برای دریافت ورودی کاربر نمایش دهید. بدین ترتیب، به شما اجازه میدهد با کاربر تعامل داشته باشید. کاربر باید فیلد را پر کند و سپس روی OK کلیک کند.
Prompt Dialog Box با استفاده از یک متد به نام prompt() نمایش داده میشود که دو پارامتر را میپذیرد: (i) برچسبی که میخواهید در جعبه متنی نمایش دهید و (ii) یک رشته پیشفرض برای نمایش در جعبه متنی.
Prompt Dialog Box دارای دو دکمه است: OK و Cancel. اگر کاربر دکمه OK را بزند، متد prompt() پنجره ورودی را وارد کرده از جعبه متنی برمیگرداند. اگر کاربر دکمه Cancel را بزند، متد prompt() null را برمیگرداند:
<html>
<head>
<script type = "text/javascript">
<!--
function getValue() {
var retVal = prompt("نام خود را وارد کنید: ", "نام شما اینجا");
document.write("شما وارد کردهاید: " + retVal);
}
//-->
</script>
</head>
<body>
<p>روی دکمه زیر کلیک کنید تا نتیجه را ببینید: </p>
<form>
<input type = "button" value = "کلیک کنید" onclick = "getValue();" />
</form>
</body>
</html>
برای ارسال نظر لطفا ابتدا وارد حساب کاربری خود شوید. صفحه ورود و ثبت نام