تنفيذ البرنامج النصي بعد تأخير محدد باستخدام JavaScript

Question

هل هناك أي طريقة JavaScript مشابهة لـ jQuery delay() أو wait() (لتأخير تنفيذ البرنامج النصي لفترة زمنية محددة)؟

Answer 1

هناك ما يلي:

setTimeout(function, milliseconds);

الوظيفة التي يمكن تمرير الوقت الذي سيتم بعده تنفيذ الوظيفة.

يرى: نافذة او شباك setTimeout() طريقة.

Answer 2

فقط للإضافة إلى ما قاله الجميع عنه setTimeout:إذا كنت تريد استدعاء دالة بمعلمة في المستقبل، فستحتاج إلى إعداد بعض استدعاءات الدوال المجهولة.

تحتاج إلى تمرير الدالة كوسيطة ليتم استدعاؤها لاحقًا.في الواقع هذا يعني عدم وجود أقواس خلف الاسم.سيقوم ما يلي باستدعاء التنبيه مرة واحدة، وسيعرض "Hello World":

var a = "world";
setTimeout(alert("Hello " + a), 2000);

لإصلاح ذلك، يمكنك إما وضع اسم دالة (كما فعل Flubba) أو يمكنك استخدام دالة مجهولة.إذا كنت بحاجة إلى تمرير معلمة، فيجب عليك استخدام وظيفة مجهولة.

var a = "world";
setTimeout(function(){alert("Hello " + a)}, 2000);
a = "Stack Overflow";

ولكن إذا قمت بتشغيل هذا الرمز، ستلاحظ أنه بعد ثانيتين ستظهر النافذة المنبثقة "Hello Stack Overflow".وذلك لأن قيمة المتغير a قد تغيرت خلال هاتين الثانيتين.لكي يقول "Hello World" بعد ثانيتين، يلزمك استخدام مقتطف الشفرة التالي:

function callback(a){
    return function(){
        alert("Hello " + a);
    }
}
var a = "world";
setTimeout(callback(a), 2000);
a = "Stack Overflow";

سوف ينتظر ثانيتين ثم يظهر "Hello World".

Answer 3

فقط للتوسع قليلا...يمكنك تنفيذ التعليمات البرمجية مباشرة في setTimeout الدعوة، ولكن كما @ باتريك يقول، يمكنك عادة تعيين وظيفة رد الاتصال، مثل هذا.الوقت هو ميلي ثانية

setTimeout(func, 4000);
function func() {
    alert('Do stuff here');
}

Answer 4

إذا كنت تريد حقًا الحصول على حظر (متزامن) delay وظيفة (على الإطلاق)، لماذا لا تفعل شيئا مثل هذا:

<script type="text/javascript">
    function delay(ms) {
        var cur_d = new Date();
        var cur_ticks = cur_d.getTime();
        var ms_passed = 0;
        while(ms_passed < ms) {
            var d = new Date();  // Possible memory leak?
            var ticks = d.getTime();
            ms_passed = ticks - cur_ticks;
            // d = null;  // Prevent memory leak?
        }
    }

    alert("2 sec delay")
    delay(2000);
    alert("done ... 500 ms delay")
    delay(500);
    alert("done");
</script>

Answer 5

تحتاج إلى استخدام setTimeout وتمريرها وظيفة رد الاتصال.السبب وراء عدم قدرتك على استخدام وضع السكون في جافا سكريبت هو أنك تمنع الصفحة بأكملها من القيام بأي شيء في هذه الأثناء.ليست خطة جيدة.استخدم نموذج حدث Javascript وابق سعيدًا.لا تحاربه!

Answer 6

تستطيع ايضا استخذام window.setInterval() لتشغيل بعض التعليمات البرمجية بشكل متكرر على فترات منتظمة.

Answer 7

وإلحاقا للتعليقات السابقة، أود أن أقول ما يلي:

ال setTimeout() لا تقوم الوظيفة في JavaScript بإيقاف تنفيذ البرنامج النصي في حد ذاته مؤقتًا، ولكنها تخبر المترجم فقط بتنفيذ التعليمات البرمجية في وقت ما في المستقبل.

لا توجد وظيفة يمكنها فعليًا إيقاف التنفيذ المضمن في JavaScript.ومع ذلك، يمكنك كتابة وظيفتك الخاصة التي تقوم بشيء مثل حلقة غير مشروطة حتى يتم الوصول إلى الوقت باستخدام Date() وظيفة وإضافة الفاصل الزمني الذي تحتاجه.

Answer 8

إذا كنت بحاجة فقط إلى اختبار التأخير، فيمكنك استخدام هذا:

function delay(ms) {
   ms += new Date().getTime();
   while (new Date() < ms){}
}

وبعد ذلك إذا كنت تريد التأخير لمدة ثانيتين فافعل:

delay(2000);

قد لا يكون الأفضل للإنتاج بالرغم من ذلك.المزيد عن ذلك في التعليقات

Answer 9

لماذا لا يمكنك وضع الكود خلف الوعد؟(كتبت من أعلى رأسي)

new Promise(function(resolve, reject) {
  setTimeout(resolve, 2000);
}).then(function() {
  console.log('do whatever you wanted to hold off on');
});

Answer 10

الرد البسيط هو:

setTimeout(
    function () {
        x = 1;
    }, 1000);

تنتظر الوظيفة أعلاه لمدة ثانية واحدة (1000 مللي ثانية) ثم تقوم بتعيين x على 1.من الواضح أن هذا مثال؛يمكنك فعل أي شيء تريده داخل الوظيفة المجهولة.

Answer 11

لقد أعجبني حقًا شرح موريوس (أعلى استجابة تم التصويت عليها) بشأن الطرق الثلاث المختلفة للاتصال setTimeout.

في الكود الخاص بي، أريد الانتقال تلقائيًا إلى الصفحة السابقة عند الانتهاء من حدث حفظ AJAX.يحتوي إكمال حدث الحفظ على رسم متحرك بسيط في CSS يشير إلى نجاح الحفظ.

وجدت في الكود الخاص بي اختلافًا بين المثالين الأولين:

setTimeout(window.history.back(), 3000);

هذا لا ينتظر انتهاء المهلة - يتم استدعاء الدالة back() على الفور تقريبًا بغض النظر عن الرقم الذي أدخلته للتأخير.

ومع ذلك، تغيير هذا إلى:

setTimeout(function() {window.history.back()}, 3000);

هذا يفعل بالضبط ما كنت آمل.

هذا ليس خاصًا بعملية back()، بل يحدث نفس الشيء مع alert().في الأساس مع alert() في الحالة الأولى، يتم تجاهل وقت التأخير.عندما أقوم برفض النافذة المنبثقة، تستمر الرسوم المتحركة الخاصة بـ CSS.

وبالتالي، أوصي بالطريقة الثانية أو الثالثة التي يصفها حتى لو كنت تستخدم وظائف مدمجة ولا تستخدم الوسائط.

Answer 12

كان لدي بعض أوامر ajax التي أردت تشغيلها مع تأخير بينهما.فيما يلي مثال بسيط لطريقة واحدة للقيام بذلك.أنا على استعداد لأن أتمزق إلى أشلاء بسبب نهجي غير التقليدي.:)

//  Show current seconds and milliseconds
//  (I know there are other ways, I was aiming for minimal code
//  and fixed width.)
function secs()
{
    var s = Date.now() + ""; s = s.substr(s.length - 5);
  return s.substr(0, 2) + "." + s.substr(2);
}

//  Log we're loading
console.log("Loading: " + secs());

//  Create a list of commands to execute
var cmds = 
[
    function() { console.log("A: " + secs()); },
    function() { console.log("B: " + secs()); },
    function() { console.log("C: " + secs()); },
    function() { console.log("D: " + secs()); },
    function() { console.log("E: " + secs()); },
  function() { console.log("done: " + secs()); }
];

//  Run each command with a second delay in between
var ms = 1000;
cmds.forEach(function(cmd, i)
{
    setTimeout(cmd, ms * i);
});

// Log we've loaded (probably logged before first command)
console.log("Loaded: " + secs());

يمكنك نسخ مقطع التعليمات البرمجية ولصقه في نافذة وحدة التحكم ورؤية شيء مثل:

Loading: 03.077
Loaded: 03.078
A: 03.079
B: 04.075
C: 05.075
D: 06.075
E: 07.076
done: 08.076

Answer 13

إن أبسط حل لاستدعاء وظيفتك مع التأخير هو:

function executeWithDelay(anotherFunction) {
    setTimeout(anotherFunction, delayInMilliseconds);
}

Answer 14

وكما قال آخرون، فإن setTimeout هو الرهان الأكثر أمانًا
لكن في بعض الأحيان لا يمكنك فصل المنطق إلى وظيفة جديدة، ثم يمكنك استخدام Date.now() للحصول على ميلي ثانية والقيام بالتأخير بنفسك....

function delay(milisecondDelay) {
   milisecondDelay += Date.now();
   while(Date.now() < milisecondDelay){}
}

alert('Ill be back in 5 sec after you click ok....');
delay(5000);
alert('im back ' +new Date());