2014-08-11 4 views
1

У меня есть три функции, называемые toggle1(), toggle2(), toggle3() связаны с моим html.Javascript таймер для переключения функций

Я хочу сделать таймер для вызова каждой функции с задержкой в ​​5 секунд (5 секунд для тестирования).

Я написал этот код, но он не работает. Любые советы о том, как заставить его работать?

Я использовал функцию init() при загрузке страницы

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; 
     } 
    } 
} 
+0

я думаю, задержка должна быть задержка (задержка); – Arunkumar

+0

Чтобы заставить его работать, ваш код должен быть примерно таким. [Фидл] (http://jsfiddle.net/tu91ex10/1/). –

ответ

0

Первая проблема заключается в ваш for цикл не так, изменить его на это должно вам начать:

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

Кроме того, переменная delay в каждом операторе switch избыточно. Сначала попробуйте изменить цикл for, который должен начать работу в направлении записи.

+1

, а также использование переменной 'delay' представляется бесполезным. –

+0

@Mr_Green изменили мой ответ, чтобы быть более отправной точкой – seanxe

0

У вас есть две основные синтаксические проблемы, которые могут привести к Issue

1) Синтаксис для цикла не отделены друг от , должно быть ;.

2) И должно быть i<=3. У вас есть i=3, который всегда будет правдой.

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

Вы можете реализовать свой собственный сон-метод и использовать его как это:

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

Stackoverflow: sleep method for java script

Конечно, это довольно прямо вперед/наивным.

+0

Комментарии ниже этого сообщения не предлагают пойти с этим методом. –

+0

Вы прочитали комментарии к этому ответу? это единственная «наивная» часть! – seanxe

0
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; 
    } 
} 
0

Пробуйте использовать функцию setInterval.

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

0
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); 
} 
0
<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> 
Смежные вопросы