نوشته شده توسط : رضا

 

وقت اون رسیده که نوشتن اولین اسکرپت خود را شروع کنید. این یکی راحته چون مجبور نیستیم درگیر اضافه کردن تگهای SCRIPT شویم. این اسکرپت کوچک به دلخواه شما وقتی نشانگر ماوستان روی یک لینک قرار می گیرد متنی را در نوار وضعیت مرورگرتان می نویسد. به مثال نگاه کنید:
 

شما هم امتحان کنید و ببینید چگونه کار می کند. نشانگر ماوس خود را روی لینک زیر قرار دهید ولی کلیک نکنید (اگر کلیک کنید، چون در کد بالا آدرس لینک، آدرس همین صفحه است پس از کلیک کردن دوباره همین صفحه باز می شود). حالا پایین پنجره مرورگر خود به نوار وضعیت نگاه کنید باید این جمله را بینید: « آموزش جاوا اسکرپت »

ماوس خود را روی این لینک قرار دهید!!!
 

بسیار خوب، این چیزی است که با فرمان onMouseover اتفاق می افتد:

  1. " "=onMouseover
    این شکل فرمان onMouseover است. مرورگر انتظار فرمان دیگری بین دو علامت دابل کوت ( " ) را دارد.

  2. '« آموزش جاوا اسکرپت »'=window.status
    این فرمان به مرورگر میگوید که جمله ای را در نوار وضعیت بنویسد. شما می توانید جمله بین دو علامت ( ' ) را با آنچه که می خواهید در نوار وضعیت به نمایش در آید جابجا کنید.

  3. return true
    عبارت را تأیید کرده و مرورگر آن را نمایش می دهد.

دلیل استفاده از علامت سینگل کوت ( ' ) در فرمان window.status این است که window.status خود قسمتی از فرمان onMouseover است که از ( " ) استفاده کرده است. اگر دوباره از علامت دابل کوت ( " ) استفاده کرده بودیم ممکن بود مرورگر در مورد اینکه چه کاری باید انجام دهد گیج می شد. چون ممکن بود علامت دابل کوت دوم را به منزله پایان فرمان onMouseovr تلقی کند و فرمان جدیدی را با window.status شروع کند:   onMouseover=""window.statuse

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

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

لینک خود را اینجا قرار دهید

در حقیقت ما همان کار قبل را تکرار کردیم ولی به جای متن از فضای خالی در فرمان window.status استفاده کردیم.

این اسکرپت جالب و مفید است و می تواند به بازدید کنندگان صفحه شما کمک کند تا بهتر بدانند لینک آنها را به چه صفحه ای می برد. و می توانند توضیحات شما را در مورد لینک ببینند.


 


:: موضوعات مرتبط: رویداد onMouseover , ,
:: برچسب‌ها: رویداد onMouseover , جاوا اسکریپت , java script , اموزش جاوا اسکریپت ,
:: بازدید از این مطلب : 340
|
امتیاز مطلب : 95
|
تعداد امتیازدهندگان : 25
|
مجموع امتیاز : 25
تاریخ انتشار : پنج شنبه 14 بهمن 1389 | نظرات (0)
نوشته شده توسط : رضا
با استفاده از دستور if امکان این وجود دارد که برنامه را حداکثر به یکی از دو جهت ممکن هدایت کنیم. یعنی اگر شرط مورد نظر برقرار بود اسکرپت یک سری کد را اجرا می کند و در صورت عدم برقراری شرط یک سری کد دیگر اجرا می شود. اگر بخواهیم برای اسکرپت خود مسیرهای بیشتری در نظر بگیریم یک راه موجود استفاده از دستورات if تو در تو است. این روش ممکن است در موارد جزئی کارایی داشته باشد اما اگر تعداد شرطها زیاد شود ما را مجبور می کند از تعداد زیادی if و else در اسکرپت خود استفاده کنیم که این مسئله هم باعث طولانی شدن برنامه و هم باعث گیج کننده شدن آن می شود از طرفی امکان اشتباه را هم بالا می برد.

راه حل دیگر استفاده از دستور شرطی switch است. این دستور را می توان در هنگامی که می خواهیم یک متغیر را با چندین مقدار مقایسه کنیم و مقدار متناسب با آنرا پیدا کنیم کار برد دارد. ساختار این دستور به صورت زیر است :

switch(x) 
{
case مقدار اول:
این کد در صورت برابری متغیر x با مقدار اول اجرا می شود
break    
case مقدار دوم:
این کد در صورت برابری متغیر x با مقدار دوم اجرا می شود
break
default:
این کد در صورتی اجرا می شود که مقدار متغیر x با هیچکدام از مقادیر ذکر شده برابر نباشد
}

در این دستور مقدار متغیر معرفی شده در قسمت switch با مقادیر آورده شده در هر case مقایسه می شود. در صورت مساوی بودن مقادیر کد همان case اجرا می شود و با استفاده از دستور break آورده شده در هر قسمت برنامه پس از اجرای کد آن قسمت به خارج از دستور switch هدایت می شود. در غیر این صورت برنامه به سراغ case بعدی می رود و در صورتی که مقدار متغیر مورد نظر با هیچکدام از case ها برایر نبود کد قسمت default اجرا خواهد شد.

قابل ذکر است که استفاده از default اختیاری است و شما بنا به نیاز خود می توانید از آن استفاده کرده یا آنرا حذف کنید.در دستور switch محدودیتی در تعدار case ها وجود ندارد و می توانید به هر تعدادی که نیاز داری از این مورد استفاده کنید.

در این قسمت به ذکر یک نمونه برای ادستور switch می پردازیم :

به کدی که در اینجا آورده شده است توجه کنید. پس از جرای این کد کادری باز می شود که از شما میخواهد عددی را وارد کنید. با وارد کردن عدد در این کادر و تأیید آن پیامی متناسب با روز معادل آن عدد در هفته ظاهر می شود. البته ما این کار را فقط برای اعداد 1 تا 3 انجام دادیم، شما در صورت تمایل می توانید آنرا تکمیل کنید :

var x=prompt('لطفاً یک عدد بین 1 تا 7 وارد کنید :',' ');

switch (x) {
case '1':
alert('شماره وارد شده مربوط به روز « شنبه » است');
break
case '2':
alert('شماره وارد شده مربوط به روز « یکشنبه » است');
break
case '3':
alert('شماره وارد شده مربوط به روز « دوشنبه » است');
break
case '4':
alert('شماره وارد شده مربوط به روز « سه شنبه » است');
break
case '5':
alert('شماره وارد شده مربوط به روز « چهارشنبه » است');
break
case '6':
alert('شماره وارد شده مربوط به روز « پنجشنبه » است');
break
case '7':
alert('شماره وارد شده مربوط به روز « جمعه » است');
break
default:
alert('روز مربوط به شماره وارد شده در این برنامه وجود ندارد');
}

 

برای مشاهده مثال بالا در عمل اینجا را کلیک کنید.



:: موضوعات مرتبط: دستور شرطی switch , ,
:: برچسب‌ها: دستور شرطی switch در جاوا اسکرپت , جاوا اسکریپت , java script , اموزش جاوا اسکریپت ,
:: بازدید از این مطلب : 280
|
امتیاز مطلب : 92
|
تعداد امتیازدهندگان : 24
|
مجموع امتیاز : 24
تاریخ انتشار : پنج شنبه 14 بهمن 1389 | نظرات (0)
نوشته شده توسط : رضا

 

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

دستور شرطی if

if (condition)
{
دستوری که در صورت درستی شرط اجرا می شود در اینجا قرار می گیرد
}

به یک مثال برای دستور if توجه کنید :

var test = confirm('اگر این پیام را تأیید کنید دستور شرطی اجرا می شود');

if (test == true) {
alert('شما دکمه مورد نظر را کلیک کردید و این پیام به نمایش در آمد');
}

برای اینکه کد بالا را آزمایش کنید لینک زیر را کلی کنید و در پیامی که نمایش داده می شود دکمه OK را کلیک کنید. اگر دکمه Cancel را کلیک کنید شرط بالا برقرا نمی شود و بدون اجرا شدن دستور شرطی صفحه مثال باز می شود.

برای مشاهده مثال بالا در عمل اینجا را کلیک کنید.


دستور شرطی if...else

برخی مواقع ممکن است بخواهیم دستور شرطی یک شرط را چک کند تا در صورت برقرار بودن آن شرط یک فرمان خاص را اجرا کند و در صورتی که شرط برقار نبود یک فرمان دیگر را به اجرا در آورد. در این موارد می توانیم از دستور if به همراه else استفاده کنیم. ساختار این دستور به شکل زیر است :

if (condition) {
دستوراتی که در صورت برقراری شرط اجرا می شوند.
}
else {
دستوراتی که در صورت عدم برقراری شرط اجرا می شوند.
}

در کد بالا ابتدا شرط بررسی می شود و در صورت برقراری آن دستورات مربوطه اجرا می شوند ولی در صورتی که شرط برقرار نباشد دستورات مربوط به قسمت else اجرا می شود.

var yourmark = prompt('یک شماره از 0 تا 20 وارد کنید :','');

if (yourmark > 10) {
alert('شماره ای که وارد کرده ای از 10 بزرگتر است');
}
else {
alert('عبارتی که شما وارد کرده اید از 10 بزرگتر نیست!');
}

برای مشاهده نتیجه مثال بالا لینک زیر را کلیک کنید و در کادری که نمایش داده می شود یک عدد از 0 تا 20 وارد کنید و دکمه OK را کلیک کنید.

مثال استفاده از دستور if...else


استفاده از دستور if..else if...else (دستورات شرطی تو در تو)

ممکن است در نظر داشته باشیم تا در صورت برقراری یک شرط یک دستور خاص اجرا شود و در صورتی که شرط برقرار نبود شرط دیگری بررسی شود و دستور مربوط به آن اجرا شود و در صورتی که هیچ یک از شرطهای قبل برقرار نبود دستور دیگری اجرا شود. در این مواقع می توانیم از دستور else if در دستور if...else قبلی استفاده کنید. به صورت زیر :

if (condition 1) {
دستوراتی که در صورت درستی شرط اول اجرا می شوند
}
else if (condition 2) {
دستوراتی که در صورت درستی شرط دوم اجرا می شوند
}
else {
دستوراتی که زمانی که هیچکدام از شرطها صحیح نباشد اجرا می شوند
}

در این روش محدودیتی از نظر تعداد شرطها وجود ندارد و می توانیم به تعداد نامحدود از دستور else if استفاده کنیم ولی در مواردی که تعداد این شرطها خیلی زیاد می شود بهتر است به جای این روش از دستور switch که بعداً توضیح داده خواهد شد استفاده کنیم.

در اینجا مثال قبل را با کمی تغییر برای این روش استفاده می کنیم :

var yourmark = prompt('یک شماره به دلخواه وارد کنید :','');

if (yourmark > 0 && yourmark < 100 ) {
alert('شماره وارد شده بین 0 تا 100 است');
}
else if (yourmark > 100) {
alert('شماره وارد شده از 100 بزرگتر است');
}
else {
alert('عبارت وارد شده یا 0 است یا به جای عدد از حروف استفاده کرده اید');
}

برای مشاهده نتیجه مثال دستور if...else if...else اینجا را کلیک کنید.


 


:: موضوعات مرتبط: دستور شرطی if...else , ,
:: برچسب‌ها: معرفی دستور شرطی if , , , else و کاربردهای مختلف آن , جاوا اسکریپت , java script , اموزش جاوا اسکریپت ,
:: بازدید از این مطلب : 351
|
امتیاز مطلب : 92
|
تعداد امتیازدهندگان : 25
|
مجموع امتیاز : 25
تاریخ انتشار : پنج شنبه 14 بهمن 1389 | نظرات (0)
نوشته شده توسط : رضا

 

در جاوا اسکرپت این امکان وجود دارد که متنی را نوشته و در صفحه نمایش بدهیم. متن مورد نظر را می توانیم قالب بندی کنیم و از تگهای HTML نیز در آن استافده کنیم. برای این کار از فرمان ()document.write استفاده می کنیم که یک فرمان جاوا اسکرپت مخصوص چاپ کردن خروجی در صفحه است. روش کار به صورت زیر است :

نوشتن متنهای ساده

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

برای نوشتن متن به این صورت کافی است تا فرمان بالا را در جایی از صفحه HTML که می خواهید متن به نمایش در آید بنویسید. در مثال زیر متنی با استفاده از جاوا اسکرپت در صفحه نمایش داده می شود، برای مشاهده مثال لینک زیر را کلیک کنید :

نوشتن متنهای ساده با استفاده از جاوا اسکرپت


نوشتن متنهای قالب بندی شده

با استفاده از فرمان document.write امکان نوشتن متنهای قالب بندی شده با استفاده از تگهای HTML هم وجود دارد. برای اینکار فقط کافیست متن HTML مورد نظر خود را در تابع ()document.write قرار دهید. برای مثال به کد زیر توجه کنید :

برای مشاهده نتیجه این مثال لینک زیر را کلیک کنید :

نوشتن متنهای قالب بندی شده با HTML توسط جاوا اسکرپت


تابع ()document.write با مقدار چند سطری

اگر بخواهیم متنی که با استفاده از جاوا اسکرپت متنی را بنویسیم که در صفحه در چند سطر نمایش داده شود به راحتی می توانیم با وارد کردم
در متن مورد نظر یا با سایر تگهای HTML این کار را انجام دهیم. اما اگر بخواهیم مقداری را که به تابع ()document.write می دهیم در چند سطر وارد کنیدم باید مقدار مورد نظر را در هر سطر از هم جدا کرده و با استفاده از عملوند رشته ای + آنها را در چند سطر به هم پیوند بزنیم.

نکته : نباید بدون استفاده از عملگر های مربوطه مقدار تابع بالا را در بیش از یک سطر بنویسید. در صورتی که متن مورد نظر خود را به این گونه در چند سطر بنویسید تابع کار نمی کند و احتمالاً با پیغام خطا مواجه می شوید.

اگر کد خود را به صورت زیر بنویسید با خطا مواجه خواهید شد :

برای اینکه با خطا مواجه نشوید و کد شما کار حود را انجام دهد باید آنرا به صورت زیر بنویسید :



:: موضوعات مرتبط: نوشتن متن با جاوا اسکریپت , ,
:: برچسب‌ها: نوشتن متن با استفاده از جاوا اسکرپت , جاوا اسکریپت , java script , اموزش جاوا اسکریپت ,
:: بازدید از این مطلب : 342
|
امتیاز مطلب : 89
|
تعداد امتیازدهندگان : 23
|
مجموع امتیاز : 23
تاریخ انتشار : پنج شنبه 14 بهمن 1389 | نظرات (0)