Javascript timer to switch functions

问题

I have three functions called toggle1(), toggle2(), toggle3() linked to my html.

I want to make a timer to call each function with a delay of 5 seconds (5seconds for testing).

I wrote this code, but it doesn't work. Any tips on how to make it work?

I have used function init() when the page loads

function timer() {
    var i = 1;
    var delay = 5000;
    for (i, i = 3, i++) {
        switch (i) {
            case 1:
                toggle1();
                delay;
                break;
            case 2:
                toggle2();
                delay;
                break;
            case 3:
                toggle3();
                delay;
                break;
        }
    }
}

回答1:

First problem is your for loop is wrong, changing it to this should get you started:

for (var i = 0; i < 3; i++) {

Also, the delay variable in each switch statement is redundant. Try changing the for loop first, that should start you off in the write direction.

回答2:

You have two basic syntactical problem which can cause issue

1) Syntax of for loop doesn't separated by , there should be ;.

2) And there should be i<=3. You have i=3 which will always be true.

for (i; i=3;i++){...}

回答3:

Try using the setInterval function.

var counter = 0;

function Toogle1() {
    console.log("1");
}

function Toogle2() {
    console.log("2");
}

function Toogle3() {
    console.log("3");
}


function TimeMachine() {
    switch (counter) {
        case 0:
            Toogle1();
            counter++;
            break;

        case 1:
            Toogle2();
            counter++;
            break;

        default:
            Toogle3();
            counter = 0;
            break;
    }
}

setInterval("TimeMachine()", 1000);

jsFiddle

回答4:

function init () {
    timer(1);
}
function timer(n) {
    var delay = 5000;
    switch (n) {
        case 1:
            toggle1();
            setTimeout(function(){ timer(2); }, delay)
            break;
        case 2:
            toggle2();
            setTimeout(function(){ timer(3); }, delay)
            break;
        case 3:
            toggle3();
            break;
    }
}

回答5:

delayedExec([toggle1, toggle2, toggle3], 5000);

function delayedExec(fns, delay, index) {
    index = index || 0;
    if (index === fns.length) return;
    fns[index]();
    setTimeout(delayedExec.bind(null, fns, delay, ++index), delay);
}

回答6:

<html>
    <head>
    <script type="text/javascript">
    var
    hMsg,
    CntFunc = {
        curr: 0,
        funcList: [],

        play: function () {
            CntFunc.funcList[CntFunc.curr]();
            CntFunc.next();
        },

        next: function () {
            if (CntFunc.curr >= CntFunc.funcList.length-1)
                CntFunc.curr = 0;
            else {
                CntFunc.curr++;
                setTimeout(CntFunc.play, 5000);
            }
        }
    };

    var toggle1 = function() {hMsg.innerHTML = "1";}
    var toggle2 = function() {hMsg.innerHTML = "2";}
    var toggle3 = function() {hMsg.innerHTML = "3";}

    window.onload = function () {
        hMsg = document.getElementById("msg");
        CntFunc.funcList = [toggle1, toggle2, toggle3];
        CntFunc.play();
    }
    </script>
    </head>
    <body>
        <div id="msg"></div>
    </body>
</html>

回答7:

You can implement your own sleep-method and use it like this:

toggle1();
sleep(5000);
toggle2();
sleep(5000);
toggle3();

Stackoverflow: sleep method for java script

Sure this is quite straight forward/naive.

来源：https://stackoverflow.com/questions/25242761/javascript-timer-to-switch-functions

标签

javascript

timer

switch-statement