%45 تخفیف، با کد daneshjoo روی تمام آموزش ها، بمناسبت روز دانشجو
زمان باقی مانده (آخرین فرصت)
سبد (0)

تبلیغات

زمانبندی رویدادها در JavaScript

1
2
3
4
5
6
7
8
9
10
11
12
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

در JavaScript، می توان یک تابع را در فاصله های زمانی معین اجرا کرد.

این قابلیت زمانبدی رویدادها (Timing Events) نامیده می شود.


زمانبدی رویدادها (Timing Events) در JavaScript

Wiki

در JavaScript، این امکان وجود دارد که یک قطعه کد را در فاصله های زمانی معیین (time-intervals) اجرا کنید. به این امکان "زمانبندی رویدادها" یا (Timing Events) می گویند.

دو متد (method) ساده برای زمانبدی رویدادها وجود دارد:

  • ()setInterval: در فاصله های زمانی معیین، یک تابع را بارها و بارها اجرا می کند.
  • ()setTimeout: بعد از گذشت یک فاصله زمانی معیین، یک تابع را یکبار اجرا می کند.

توجه: متدهای ()setInterval و ()setTimeout هر دو جزء متدهای شیء window در مدل DOM هستند.


متد ()setInterval

Wiki

متد ()setInterval، در فاصله های زمانی معین، یک تابع مشخص را بارها و بارها اجرا می کند.

نحوه استفاده:

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

متد ()window.setInterval را می توان بدون پیشوند window نیز نوشت.

پارامتر اول متد ()setInterval باید یک تابع باشد.

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

توجه: هر 1000 میلی ثانیه معادل 1 ثانیه است.

مثال (زمانبندی رویدادها در JavaScript)

هر 3 ثانیه یکبار، پیغام "Hello" نمایش داده می شود:

setInterval(function(){alert("Hello")},3000);
خودتان امتحان کنید »

این مثال، فقط طرز کار متد ()setInterval را نشان می دهد و اینکه بخواهید هر 3 ثانیه یکبار یک پیغام را نمایش دهید خیلی واقعی نیست.

در مثال زیر، متد ()setInterval برای نمایش یک ساعت دیجیتال، تابع ()myTimer را هر 1 ثانیه یکبار اجرا می کند:

مثال (زمانبندی رویدادها در JavaScript)

نمایش زمان جاری:

var myVar=setInterval(function(){myTimer()},1000);

function myTimer()
{
var d=new Date();
var t=d.toLocaleTimeString();
document.getElementById("demo").innerHTML=t;
}
خودتان امتحان کنید »

چگونه اجرا را متوقف کنیم؟

Wiki

متد ()clearInterval، برای توقف اجرای تابع مشخص شده در ()setInterval استفاده می شود.

نحوه استفاده:

window.clearInterval(intervalVariable)

متد ()window.clearInterval را می توان بدون پیشوند window نیز نوشت.

برای اینکه بتوان از متد ()clearInterval استفاده کرد، باید زمان ایجاد متد ()setInterval، از یک متغیر عمومی استفاده کرد:

myVar=setInterval("javascript function",milliseconds);

سپس قادر خواهید بود برای توقف اجرای تابع، از متد ()clearInterval استفاده کنید.

مثال (زمانبندی رویدادها در JavaScript)

مثال زیر مانند قبل است، اما یک دکمه "Stop time" به آن اضافه شده است:

<p id="demo"></p>
<button onclick="myStopFunction()">Stop time</button>

<script>
var myVar=setInterval(function(){myTimer()},1000);
function myTimer()
{
var d=new Date();
var t=d.toLocaleTimeString();
document.getElementById("demo").innerHTML=t;
}
function myStopFunction()
{
clearInterval(myVar);
}
</script>
خودتان امتحان کنید »

متد ()setTimeout

Wiki

متد ()setTimeout، بعد از گذشت یک فاصله زمانی معیین، یک تابع را یکبار اجرا می کند

نحوه استفاده:

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

متد ()window.setTimeout را می توان بدون پیشوند window نیز نوشت.

پارامتر اول متد ()setTimeout باید یک تابع باشد.

پارامتر دوم، نشان می دهد که از حالا چند میلی ثانیه دیگر می خواهید پارامتر اول، اجرا شود. (برحسب میلی ثانیه)

مثال (زمانبندی رویدادها در JavaScript)

بعد از گذشت 3 ثانیه پیغام "Hello" ظاهر می شود:

setTimeout(function(){alert("Hello")},3000);
خودتان امتحان کنید »

چگونه اجرا را متوقف کنیم؟

Wiki

متد ()clearTimeout، برای توقف اجرای تابع مشخص شده در ()setTimeout استفاده می شود.

نحوه استفاده:

window.clearTimeout(timeoutVariable)

متد ()window.clearTimeout را می توان بدون پیشوند window نیز نوشت.

برای اینکه بتوان از متد ()clearTimeout استفاده کرد، باید زمان ایجاد متد ()setTimeout، از یک متغیر عمومی استفاده کرد:

myVar=setTimeout("javascript function",milliseconds);

سپس، اگر تابع قبلاً اجرا نشده باشد، قادر خواهید بود برای توقف اجرای تابع، از متد ()setTimeout استفاده کنید.

مثال (زمانبندی رویدادها در JavaScript)

مثال زیر مانند قبل است، اما یک دکمه "Stop time" به آن اضافه شده است:

var myVar;

function myFunction()
{
myVar=setTimeout(function(){alert("Hello")},3000);
}

function myStopFunction()
{
clearTimeout(myVar);
}
خودتان امتحان کنید »

مثال - خودتان امتحان کنید

یک مثال ساده

ایجاد یک ساعت دیجیتال

آموزش صوتی JavaScript

بستن
مدرس:
سوال و جواب:

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

فقط کافی است روی عنوان پاراگراف مورد نظرتان کلیک کنید تا پخش صدا آغاز شود ...!

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