setTimout و setInterval در جاوا اسکریپت

بنام خدا .  قصد داریم  این جلسه رو اختصاص بدیم به مبحث Timing یا زمانیندی در جاوا اسکریپت .

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

1- تکرار یک عمل بصورت خود کار در فواصل زمانی مشخص.

2- انجام یک عمل بعد از گذست یک زمان مشخص .

برای مورد اول از تابع setInterval به شکل زیر استفاده میکنیم.


window.setInterval("javascript function", milliseconds);

در بخش javascript function تابع یا کدی رو که میخواییم اجرا بشه رو مینویسیم . و در قسمت millisecond میزان فاصله زمانی بین اجرا ها بر اساس میلی ثانیه رو وارد میکنیم.

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



<p id="timeLable"></p>

<script>
//فراخوانی متد clock در فواص زمانی 1 ثانیه 
var myVar=setInterval(function(){clock()},1000);

function clock() {
    //با فراخوانی این تابع هر ثانیه یکبار ما یک ساعت فعال خواهیم 
داشت
    var date = new Date();
    document.getElementById("timeLable").innerHTML = 
date.toLocaleTimeString();
}
</script>

هر جایی از کد که بخواییم  ایم اجرا متوقف بشه به شکل زیر عمل میکنیم :


clearInterval(myVar);//با استفاده از متغییری که در حین ساختن تایمر ایجاد کردیم میتونیم اون رو غیر فعال کنیم 

مثلا میتونیم به شکل یک رویداد توی  یک دکمه فراخوانیش کنیم :


<button onclick="clearInterval(myVar)">توقف ساعت</button>

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


window.setTimeout("javascript function", milliseconds);

javascript function تابعی که موقع تموم شدن زمانی که در milliseconds آورده شده اجرا خواهد شد .


var myVar=setTimeout(function(){alert('This is AppInApps')},3000);//نشان دادن یک آرت باکس بعد از تموم شدن 3 ثانیه

 

برای  اینکه این عمل رو خنثی کنیم و نذاریم اجرا بشه به شکل زیر عمل میکنیم.:


clearTimeout(myVar);

این دو تابع توی طراحی اسلایدرها و بسیاری از بخشهای دیگه رابط کاربری وب سایت ها کاربرد دارند.

تا جلسه بعد در پناه حق .


فایلهای ضمیمه
توجه! هیچ فایل ضمیمه ای برای این مطلب یافت نشد

نظرات شما نظر جدید