ساخت پاپ آپ با جاوا اسکریپت

جاوا اسکریپت عملکردهای داخلی مختلفی را برای نمایش پیامهای پاپ آپ برای اهداف مختلف مانند نمایش پیام ساده یا نمایش پیام و پذیرش آن برای کاربر یا نمایش پنجره برای دریافت مقدار ورودی کاربر فراهم می کند.

جعبه هشدار
از تابع هشدار () برای نمایش یک پیام پاپ آپ به کاربر استفاده کنید. این پنجره حاوی یک دکمه تأیید برای بستن پنجره است.

alert("This is alert box!");  // display string message

alert(100); // display number 

alert(true); // display boolean

عملکرد گیر می تواند پیامی از هر نوع داده مانند رشته ، شماره ، منطقی و غیره را نشان دهد. نیازی به تبدیل پیام به نوع رشته نیست.

کادر را تأیید کنید
بعضی اوقات شما نیاز به گرفتن یک گواهی کاربر برای ادامه کار دارید. به عنوان مثال ، شما می خواهید قبل از ذخیره اطلاعات به روز شده یا حذف داده های موجود ، گواهی کاربر را بگیرید. در این سناریو ، از گواهی عملکرد JavaScript () داخلی استفاده کنید. عملکرد تأیید () با دو دکمه OK و Cancel یک پیام بازشو را به کاربر نمایش می دهد. می توانید دکمه مورد نظر کاربر را بررسی کرده و مطابق آن ادامه دهید.

مثال زیر نحوه نمایش کادر تأیید را نشان می دهد و سپس دکمه مورد نظر کاربر را بررسی می کند.

var userPreference;

if (confirm("Do you want to save changes?") == true) {
    userPreference = "Data saved successfully!";
} else {
    userPreference = "Save Cancelled!";
}

 

جعبه سریع
بعضی اوقات ممکن است برای انجام کارهای بیشتر با صفحه وب ، نیاز به ضبط ورودی کاربر داشته باشید. به عنوان مثال ، شما می خواهید EMI را بر اساس مدت وام مورد نظر کاربر محاسبه کنید. برای این نوع سناریو ، از نوار عملکرد JavaScript داخلی () استفاده کنید.

عملکرد سریع رشته ای از دو پارامتر را در بر می گیرد. پارامتر اول پیام برای نمایش است و پارامتر دوم مقدار پیش فرض است که با نمایش پیام در متن ورودی قرار خواهد گرفت.

prompt([string message], [string defaultValue]);

 

var tenure = prompt("Please enter preferred tenure in years", "15");
    
if (tenure != null) {
    alert("You have entered " + tenure + " years" );
}

 

 

همانطور که در مثال بالا مشاهده می کنید ، یک پیام را به عنوان اولین پارامتر و مقدار پیش فرض "15" به عنوان پارامتر دوم مشخص کنید. عملکرد سریع مقدار وارد شده توسط کاربر را برمی گرداند. اگر کاربر چیزی وارد نکند ، خالی برگردانده می شود. بنابراین توصیه می شود قبل از اقدام مقدار خالی را بررسی کنید.

 

نکته ای که باید به خاطر داشته باشید:
می توانید با استفاده از توابع عمومی ، یک پیام بازشو نشان دهید - هشدار () ، تأیید () ، و سریع ().
عملکرد هشدار () با دکمه "OK" یک پیام بازشو را نشان می دهد.
صفحه نمایش () نمایش دکمه های "OK" و "Cancel" را تأیید کنید. از عملکرد OK () برای تأیید کاربر استفاده کنید.
تابع Prompt () به شما امکان می دهد با فشار دادن دکمه های "OK" و "لغو" ورودی را وارد کنید. تابع () () مقدار وارد شده توسط کاربر را برمی گرداند. اگر کاربر هیچ مقدار ورودی را ارائه ندهد ، این مقدار خالی را برمی گرداند.