Dialog Box در جاوا اسکریپت - آموزش جاوا اسکریپت

لیست محتوای این بخش

Dialog Box در جاوا اسکریپت

آموزش دیالوگ باکس در جاوا اسکریپت - آموزش dialog box در javascript

زبان جاوا اسکریپت از سه نوع دیالوگ باکس پشتیبانی می کند . از این دیالوگ باکس ها میتوان برای نمایش یک هشدار یا متن به کاربر ، یا دریافت یک تائیدیه از او استفاده کرد . دیالوگ باکس ها را میتوان روی هر input استفاده کرد .

دیالوگ باکس هشدار یا Alert Dialog Box در جاوا اسکریپت :

دیالوگ باکس های هشدار ، همانطور که از اسمش پیداست برای نمایش یک هشدار متنی به کاربر استفاده میشوند . برای مثال اگر یک فرمی وجود داشته باشد که باید متنی در آن وارد شود و کاربر آنرا فراموش کرده باشد شما میتوانید یک هشدار به او نشان دهید .

با این وجود شما میتوانید برای نمایش متن های دیگر نیز از دیالوگ باکس استفاده کنید . در دیالوگ باکس های هشدار معمولا فقط یک دکمه ی OK به کاربر نشان داده میشود تا فقط دیدن پیام را تائید کند .

مثال :

<html>
   <head>   
      <script type = "text/javascript">
         <!--
            function Warn() {
               alert ("This is a warning message!");
               document.write ("This is a warning message!");
            }
         //-->
      </script>     
   </head>
   
   <body>
      <p>Click the following button to see the result: </p>      
      <form>
         <input type = "button" value = "Click Me" onclick = "Warn();" />
      </form>     
   </body>
</html>

در مثال بالا بعد از کلیک دکمه ی Click Me فقط یک متن خالی نمایش داده میشود که با کلیک روی Ok پنجره بسته میشود .

دیالوگ تائید در جاوا اسکریپت :

دیالوگ باکس تائید ، از رضایت کاربر برای کاری که میخواهد انجام بدهد ، مطمئن میشود .این دیالوگ باکس یک متنی به همراه دو دکمه ی OK و Cancel نمایش میدهد .

اگر کاربر روی Ok کلیک کند متد confirm() مقدار true برمیگرداند و اگر روی Cancel کلیک شود مقدار false برمیگرداند . مثلا اگر بخواهید وقتی روی دکمه ی حذف کلیک میشود یک تائیدیه اضافی از کاربر بگیرید این روش برای شما کارساز خواهد بود .

مثال :

<html>
   <head>   
      <script type = "text/javascript">
         <!--
            function getConfirmation() {
               var retVal = confirm("Do you want to continue ?");
               if( retVal == true ) {
                  document.write ("User wants to continue!");
                  return true;
               } else {
                  document.write ("User does not want to continue!");
                  return false;
               }
            }
         //-->
      </script>     
   </head>
   
   <body>
      <p>Click the following button to see the result: </p>      
      <form>
         <input type = "button" value = "Click Me" onclick = "getConfirmation();" />
      </form>      
   </body>
</html>

دیالوگ باکس دریافت اطلاعات در جاوا اسکریپت :

این دیالوگ باکس زمانی مفید است که بخواهید اطلاعاتی را از کاربر درون یک دیالوگس باکس دریافت کنید . کاربر بعد از دیدن کادر پیام باید input را پر کند و سپس کلید Ok را کلیک کند .

این دیالوگ باکس توسط متد prompt() ایجاد میشود که دو پارامتر ورودی دارد . اولی یک متن هست که درون دیالوگ نمایش داده میشود و دوم متن پیشفرضی است که درون input نمایش داده میشود .

این دیالوگ باکس دو عدد دکمه دارد که یکی Ok و دیگری Cancel می باشد . اگر روی Ok کلیک شود متد prompt() مقدار درون input را برمیگرداند ولی اگر روی Cancel کلیک شود این متد مقدار null برمی گرداند .

مثال :

<html>
   <head>     
      <script type = "text/javascript">
         <!--
            function getValue() {
               var retVal = prompt("Enter your name : ", "your name here");
               document.write("You have entered : " + retVal);
            }
         //-->
      </script>      
   </head>
   
   <body>
      <p>Click the following button to see the result: </p>      
      <form>
         <input type = "button" value = "Click Me" onclick = "getValue();" />
      </form>      
   </body>
</html>

. اتمام .

محصولات برگزیده مناسب شما

دوره ی آموزش ویوجی اس ( Vuejs 3) پروژه محور به همراه Nuxt js دوره ی آموزش جاوااسکریپت-صفرتاصد کارگاه آموزشی کار با Grunt js

یک کتاب صوتی رایگان مهمان ما باشید

با ثبت نام و ورود به پنل کاربری خود ، یک کتاب صوتی رایگان به نام کتاب فقط برای تفریح ( داستان خلق لینوکس ) در پنل شما قرار میگیرد. این کتاب داستان زندگی یکی از تاثیرگذارترین برنامه نویسان تاریخ یعنی لینوس توروالدز است.

ثبت نام/ورود

ساخته شده با عشق در آواسام

تمام حقوق محفوظ است