Dormir no loop javascript?

Vou come√ßar por explicar o que estou tentando fazer ūüôā

O meu aplicativo é implementado usando PHP (Zend framework) e Javascript. Quero fazer um questionário para o meu pedido e até agora fiz o seguinte:

Minha página é constituída por uma série de elementos

onde # denota o índice da pergunta spesific. Por exemplo, meu HTML parece assim:

 
. . . etc.

Agora, o usu√°rio deve ver cada pergunta por um hor√°rio pr√©-selecionado at√© que a pergunta mude para a resposta poss√≠vel e o usu√°rio deve clicar em “Sim” ou “N√£o” dependendo se ele acha que a resposta est√° correta. Apenas um

elemento está ativo por vez, os outros display:none; . Depois que a questão for alterada para a próxima, o atributo active é removido da questão atual e configurado para o próximo, de modo que o usuário percorra todas as perguntas.

Com cada question/possible answer -parto, associei dois inteiros que explicam quanto tempo o usu√°rio tem tempo para ver a quest√£o e quanto tempo o usu√°rio tem tempo para responder a pergunta. Deixe-me dar um exemplo:

O usuário vê isso (mais ou menos):

 QUESTION 1/10 The name of the President of US? -------------- 5 sec .. The name of the President of US? -------------- 4 sec .. The name of the President of US? -------------- 3 sec .. etc. THE TIME ENDS and the question changes to answer mode(buttons YES/NO appear also in this part): Bruce Wayne? ------------------------------7 sec [YES] [NO] ... Bruce Wayne? ------------------------------6 sec [YES] [NO] ... Bruce Wayne? ------------------------------5 sec [YES] [NO] ... etc. 

Quando o tempo se esgotar na fase de resposta OU, o usu√°rio clica em qualquer um dos bot√Ķes SIM / NO jQuery remove ACTIVE da quest√£o atual e define-o para o pr√≥ximo. O valor que o usu√°rio clicou tamb√©m √© armazenado no elemento oculto. Este processo deve ser repetido todo o caminho atrav√©s do question√°rio.

Agora, sobre os timeres da fase de perguntas e respostas. Eles n√£o s√£o fixos, mas s√£o espelhados para cada pergunta. Por exemplo, a question1 pode ter tempos de pergunta / resposta (em segundos) 5/10 e assim por diante.

Agora, minha pergunta √© … como implementar isso no lado do javascript ??? O meu problema ocorre quando eu encaminhar o javascript atrav√©s da matriz que cont√©m todas as informa√ß√Ķes sobre as perguntas (quais conjuntos de PHP no servidor) … Eu deveria ser capaz de iterar atrav√©s de todas as question/answer -pairs no lado do cliente e depois em cada itera√ß√£o interrompe a itera√ß√£o de passar para a pr√≥xima (pr√≥xima pergunta) at√© que o usu√°rio tenha clicado em resposta ou o tempo esgotado. Mas o problema √© que eu entendi que N√ÉO PODE dormir no for-loop ou em .each in jQuery … Voc√™ v√™ meu problema? ūüôā

Foram sugeridas algumas sugest√Ķes sobre implementa√ß√£o ūüôā

Altere o loop for para uma function recursiva chamada via setTimeout

 var timeLeft = 10, countdown = function(){ $('#mySpan').html('The name of the President of US? -------------- ' + timeLeft + ' sec'); timeLeft -= 1; if (timeLeft) { setTimeout(countdown, 1000); } }; countdown(); 

Pegue essa l√≥gica e voc√™ pode estend√™-la para mudar sua pergunta ap√≥s X segundos e assim por diante, e ent√£o voc√™ pode escal√°-la tomando par√Ęmetros como maxTime , questionText e questionType para exibir um campo de input ou um conjunto de bot√Ķes de r√°dio, por exemplo.

Demonstração rápida: http://jsfiddle.net/AlienWebguy/aW9mH/

Aqui está um pouco de uma maneira peculiar de fazer isso com o qual experimentei ultimamente. Eu não sugeriria que você fizesse algo assim sem se sentir confiante de que você entende, mas é legal brincar.

 function countdown(loops, pause, id) { (function setup(timer, el, text) { (function loop(invalid) { (function check(stop) { return stop || !loops-- || timer(loop, pause); })(invalid || !loops, el[text] = loops); })(!loops || !pause); })(setTimeout, document.getElementById(id) || {}, 'innerHTML'); }‚Äč countdown(10, 1000, 'timer'); 

http://jsfiddle.net/userdude/ghN3m/1

√Č um pouco estranho, mas foi divertido experimentar.

Javascript está lá para tornar um site reativo NÃO proativo.

Ent√£o, n√£o deve simplesmente morrer.

Se isso acontecer, seus clientes est√£o fora da porta