setTimeout with changing timeout value

Question

I'm working on some timeout in jQuery but I got a problem with my timeout value. So, I got an array of value (Ex : ["2490", "4200"]), and I want my timeout to print the value of the array after 2490ms, then go back to 0 and finaly print the next value of the array after 4200ms. But it never go back to 0

Actualy, this is the jQuery code :

var array = ['2490', '4200'];
var mytimeout;

for (var i = 0; i < array.length; ++i)
{
    doTimeout(i);
    clearTimeout(mytimeout);
}

function doTimeout(i) {
    mytimeout = setTimeout(function() {
       $('#text').append(array[i]);
    }, array[i]);
}

JSFIDDLE : https://jsfiddle.net/2aftscou/

So everything seems to work except the fact that I want my timer to be reinitialize at 0 when it ends (that's why I've used clearTimeout(), but it doesn't work in this case).

I really don't know what to do

Note: I think setTimeout() only executes once in any case, clearTimeout() is only needed if you want to cancel the one timeout before it happens. setInterval() is repeating. — ebyrob
– ebyrob, Commented Jun 23, 2016 at 20:04

Dexygen · Accepted Answer · 2016-06-23 20:19:44Z

1

This will not work. Your timeout will be killed after start. You have to start new timeout after old timeout will be executed.

Something like this

function doTimeout(i) {
    mytimeout = setTimeout(function() {

    $('#text').append(array[i]);
    i++;
if (i<array.length) {
doTimeout(i)
 }

   }
}

edited Jun 23, 2016 at 20:19

Dexygen

12.6k13 gold badges87 silver badges154 bronze badges

answered Jun 23, 2016 at 20:02

Drag13

6,0281 gold badge22 silver badges44 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Andrew Brooke · Accepted Answer · 2016-06-23 20:09:00Z

0

Your current implementation is clearing the timeout right away. You can chain the timeouts together with something like this

var array = ['2490', '4200'];
var mytimeout;

function doTimeout(i) {
  mytimeout = setTimeout(function() {
    $('#text').append(array[i]);
    if (i <= array.length)
      doTimeout(i + 1);
  }, array[i]);
}

doTimeout(0);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p id="text">

</p>

edited Jun 23, 2016 at 20:09

answered Jun 23, 2016 at 20:03

Andrew Brooke

12.2k8 gold badges41 silver badges56 bronze badges

1 Comment

Project FH Over a year ago

That worked, thanks man I'm not used to Javascript to be honnest ^^

Collectives™ on Stack Overflow

setTimeout with changing timeout value

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related