English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

طريقة Window setInterval()

مثلث جافا سكربت نافذة

setInterval()يستدعي الطريقة مرة واحدة وظيفة أو قطعة كود معينة، مع تأخير ثابت بين كل استدعاء.

تستمر طريقة setInterval() في استدعاء الدالة المحددة أو الكود المحدد حتى يتم استدعاءclearInterval()الطريقة أو إغلاق النافذة.

يعد هذا الطريقة ميزة فريدة تمثل معرف فاصلة الزمنية، لذا يمكنك حذفها في وقت لاحق عن طريق استدعاء clearInterval() أو إغلاق النافذة.

لتنفيذ الدالة مرة واحدة فقط في فترة زمنية محددة بالأمثلة، استخدمsetTimeout()الطريقة.

النحو:

window.setInterval(function, تأخير, param1, param2, ...)
setInterval(function() { alert("Hello World"); }, 2000);
اختبار لرؤية‹/›

تطابق المتصفح

الرقم في الجدول يحدد إصدار المتصفح الذي يدعم طريقة setInterval() بشكل كامل:

الطريقة
setInterval()11414

قيمة المعدل

المعدلاتالوصف
function(مطلوب) كلالتأخير (التأخير)تنفيذ الدالة مرة كل ملي ثانية
التأخير(مطلوب) يجب أن تكون التدوينة بالأمثلة (1000 ms = 1 ثانية)، لتحقيق تأخير بين تنفيذ الدالة أو الكود المحدد. إذا كان هذا القيمة أقل من 10، يتم استخدام القيمة 10
param1, param2, ...(اختياري) نقل إلى هذاfunction(وظيفة)معدلات أخرى  (لا يدعمها إصدار IE9 وأقدم)

تفاصيل تقنية

النتيجة المقدرة:رقم، يمثل معرف فاصلة الزمنية المحددة للمدة المقدرة. يمكن استخدام هذا القيمة مع طريقة clearInterval() لإلغاء التدوينة

مزيد من الأمثلة

هذا المثال يشارك إلى دالة "معينة" خارجية:

مغير intervalID;
دالة myFunc() {
  intervalID = setInterval(myCallback, 2000);
}
دالة myCallback() {
  alert("مرحبًا بالعالم");
}
اختبار لرؤية‹/›

عرض الوقت الحالي (مثل ساعة الرقمية، يتم تنفيذ دالة startTimer() كل ثانية واحدة):

مغير intervalID = setInterval(startTimer, 1000);
دالة startTimer() {
   مغير date = new Date();
   مغير x = document.getElementById("result");
   x.innerHTML = date.getHours() + ":" + date.getMinutes() + ":" + date.getSeconds();
}
اختبار لرؤية‹/›

في المثال السابق، يتم إيقاف الوقت باستخدام clearInterval():

مغير intervalID = setInterval(startTimer, 1000);
دالة startTimer() {
   مغير date = new Date();
   مغير x = document.getElementById("result");
   x.innerHTML = date.getHours() + ":" + date.getMinutes() + ":" + date.getSeconds();
}
دالة stopTimer() {
   clearInterval(intervalID);
}
اختبار لرؤية‹/›

تبديل بين لونين خلفية كل 200 ملي ثانية حتى يتم إيقافه بواسطة clearInterval():

مغير t = setInterval(setColor, 200);
دالة setColor() {
   مغير x = document.body;
   x.style.backgroundColor = (x.style.backgroundColor == "coral") ? "lightgreen" : "coral";
}
دالة stopColor() {
   clearInterval(t);
}
اختبار لرؤية‹/›

إنشاء شريط التقدم الديناميكي باستخدام setInterval() و clearInterval():

مغير i = 0;
مغير bar = document.getElementById("progress-bar");
مغير t;
دالة start() {
  t = setInterval(progress, 60);
}
دالة progress() {
  إذا (i < 100) {
 i++;
 bar.style.width = i + "%";
 bar.innerHTML = i + "%";
  }
 clearInterval(t);
  }
}
function stop() {
  clearInterval(t);
}
اختبار لرؤية‹/›

تقديم المعلمات إلى دالة myFunc (لا تعمل في إصدارات IE9 وأقدم):

var intervalID = setInterval(myFunc, 2000, "First", "Second", "Third");
اختبار لرؤية‹/›

لكن، إذا كنت تستخدم الدالة غير المسمى، فإنها ستقوم بالتشغيل في جميع المتصفحات:

var intervalID = setInterval(function() { myFunc("First", "Second", "Third"); }, 2000);
اختبار لرؤية‹/›

مراجع ذات صلة

مرجع نافذة (Window):طريقة clearInterval()

مرجع نافذة (Window):طريقة setTimeout()

مرجع نافذة (Window):طريقة clearTimeout()

مثلث جافا سكربت نافذة