کار با جعبه های پیغام در جاوا اسکریپت

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

کار با جعبه های پیغام در جاوا اسکریپت

Free-Learn

کار با جعبه های پیغام در جاوا اسکریپت

خب اصلا این جعبه های پیغام که میگیم یعنی چی؟! ببینید دوستان من فکر میکنم تا الان شاید برای یکبارم که شده از این جعبه های پیغام در سایت های مختلف دیده باشید.

جعبه های پیغامی که مثلا میاد رو صفحه و هشداری چیزی میده یا مثلا یه باکس میاد و میگه آیا مطمعن هستید میخواید این رو حذف کنید و … بطور کلی به همچین چیزایی جعبه های پیغام میگن که البته در زبان جاوا اسکریپت بهشون Popup Boxes هم میگن.

حال در زبان جاوا اسکریپت ما ۳ نوع جعبه پیغام میتونیم داشته باشیم :

  • جعبه هشدار یا Alert Box
  • جعبه تاییدیه یا Confirm Box
  • جعبه گرفتن مقدار از کاربر یا Prompt Box

از اسمشون هم مشخصه که هرکدوم برای چه کاری استفاده میشوند، مثلا از Alert Box برای نمایش پیغام های هشدار استفاده میشه یا مثلا از Confirm Box برای اینکه از کاربر چیزی بپرسه و کاربر هم بگه بله یا خیر ( تایید یا کنسل کردن ) و..

Free-Learn

جعبه هشدار یا Alert Box در جاوا اسکریپت

جعبه هشدار یا Alert Box یکی از معروف ترین و پرکاربردترین جعبه های هشدار است که در زبان جاوا اسکریپت ازش برای نمایش پیغام های هشدار یا پیغام های اطلاعاتی ( درکل برای نمایش پیغام به کاربر ) استفاده میشه.

شکل کلی برای استفاده از Alert Box :

که کافیه بجای Your Message In Here هر متنی دوست داشتید قرار بدید ، دیگه اون متن در باکس پیغام نمایش داده خواهد شد.

مثال شماره ۱ : نمایش متن ” سلام خوبی ” به محض بالا اومدن صفحه ( لود صفحه )

امتحان کنید

مثال شماره ۲ : نمایش پیغام وقتی بروی یک دکمه کلیک میشود

امتحان کنید

مثال شماره ۳ : قرار دادن پیغام در یک تابع ، و نمایش پیغام وقتی بروی یک دکمه کلیک میشود ( یعنی باید وقتی بروی دکمه کلیک میشه تابع اجرا بشه )

امتحان کنید

Free-Learn

جعبه تاییدیه یا Confirm Box در جاوا اسکریپت

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

شکل کلی برای استفاده از Confirm Box :

که کافیه بجای Your Message In Here هر متنی دوست داشتید قرار بدید ، دیگه اون متن در باکس پیغام بهمراه ۲ تا دکمه OK و Cancel نمایش داده خواهد شد.

مقدار برگشتی که این جعبه پیغام میتونه به ما بده یا true هست یا false ( یعنی اگه کاربر بروی OK کلیک کرده بود میشه True و اگه بروی Cancel کلیک کرده باشه میشه False )

مثال شماره ۱ : نمایش ساده جعبه پیغام تایید یا کنسل توسط کاربر ( نمونه پیشرفته تره این مثال رو حتما کمی پایین تر در بخش مثال های بیشتر مشاهده نمایید )

امتحان کنید

Free-Learn

جعبه گرفتن مقدار از کاربر یا Prompt Box در جاوا اسکریپت

این نوع جعبه هم از اسمش مشخصه که چکار میکنه، یک جعبه پیغام برای گرفتن مقدار از کاربر و در ادامه اونکاری که قراره ما بروی همون مقداری که کاربر وارد کرد انجام بدیم.

شکل کلی برای استفاده از Prompt Box :

  • Your Message In Here : متن پیغام شما برای نمایش به کاربر
  • Default_Value : یک مقدار از پیش تعریف شده برای جعبه

مقدار برگشتی که این جعبه پیغام میتونه به ما بده ۲حالت داره، اگه کاربر بروی دکمه OK کلیک کرده باشه مقدار برگشتی میشه همون چیزی که کاربر وارد کرده و اگه بروی Cancel کلیک کرده باشه مقدار برگشتی میشه null

مثال شماره ۱ : نمایش ساده جعبه پیغام برای گرفتن نام کاربر ( نمونه پیشرفته تره این مثال رو حتما کمی پایین تر در بخش مثال های بیشتر مشاهده نمایید )

امتحان کنید

Free-Learn

مثال های بیشتر

در ادامه آموزش کار با جعبه های پیغام در جاوا اسکریپت میخوایم با مثال های بیشتر از این جعبه های پیغام آشنا بشیم، ۲ مثال زیر در واقع حالت پیشرفته تره جعبه های Confirm Box و Prompt Box می باشد.

مثال شماره ۱ : کاربر بروی یک دکمه کلیک میکنه و ازش میپرسه آیا مطمعنی برای حذف این مورد ( همینجوری الکی ) و اگه کاربر بروی OK کلیک کرد در صفحه یه پیغام میده که بله مثلا کاربر بروی OK کلیک کرده و یه پیغام دیگه اگه بروی Cancel کلیک کرده بود.

امتحان کنید

مثال شماره ۲ : گرفتن یک نام از کاربر و نمایش همان نام در صفحه ( اگه کاربر چیزی وارد نکنه و بروی دکمه OK کلیک کنه یا هم اگه بروی دکمه Cancel کلیک کنه بهش پیغام میده که شما بروی دکمه کنسل کلیک کرده اید یا هم کلا باکس رو خالی گذاشتید )

امتحان کنید

Free-Learn

دریافت PDF یا پرینت این مطلب