javascript pausando um script altera a ordem de aparição

StackOverflow https://stackoverflow.com//questions/9615469

  •  09-12-2019
  •  | 
  •  

Pergunta

eu tenho o seguinte script:

posting();      
pause(time);    
postSent(postUrl, fields);

function postSent(postUrl, fields)
{
  $.ajax( {                                    
  url : postUrl,
  type : "POST",
  data : fields,
  cache : false,
  error : function(xhr, textStatus, errorThrown) {
        var answer = xhr.responseText;         
    answer = answer.split(":");
    answer = answer[0].replace(/}/g,"").replace(/{/g,"").replace(/"/g,"");
    if (answer == "id")
    {
            isPostSent = true;              
    }
    else
    {
        isPostSent = false;         
    }         

    }        
   }); 
}

function pause(milliseconds) {
var dt = new Date();
while ((new Date()) - dt <= milliseconds) { /* Do nothing */ }
}

function posting()
{
var table = ''; 
table += '<table border="0" rules="none" cellpadding="5" style="z-index:+10; position:fixed; top:35%; left:35%; box-shadow:  0px 0px 5px 5px #888888;" rules="none" border="0" bgcolor="#edeff4">';
table += '<td align="center">';
table += '<img src="images/loading.gif" id="post_status_image">';
table += '</td>';
table += '<tr >';
table += '<td align="center">שולח הודעה, אנא המתן...</td>';
table += '</tr>';
table += '<tr>';
table += '<td align="center" id="post_status"></td>';
table += '</tr>';
table += '<tr >';
table += '<td align="center" ><img id="post_close" src="images/close1.png" onclick="closePop()" style="visibility:hidden;"></td>';
table += '</tr>';
table += '</table>';
document.getElementById('post').innerHTML = table;  
 }

o tempo está definido para 3.000 milissegundos.meu problema é que quero a função post() para mostrar a tabela na tela (é uma espécie de tela de "carregamento") e depois pausar o script.na verdade, por algum motivo o script primeiro pausa, e só depois de terminar, ele me mostra a tela de carregamento ...Por quê ?

Foi útil?

Solução

Os navegadores executam JavaScript e renderizam tudo em um único thread.Portanto, todas as três funções JS serão concluídas antes da atualização da página.É por isso que você deveria nunca implementar uma função de pausa em JS que se baseia em um loop while e verifica a hora.Em vez disso, você precisa usar setTimeout() e coloque qualquer código que precise ser executado após a pausa no retorno de chamada para o qual você passa setTimeout().

Usando seu código de exemplo:

posting();
setTimeout(function() {
    postSent(postUrl, fields);
}, 3000);

Outras dicas

Não há função sleep ou pause em javascript nativo.Mas podemos conseguir assim.

function sleep(milliseconds) {
  var start = new Date().getTime();
  for (var i = 0; i < 1e7; i++) {
    if ((new Date().getTime() - start) > milliseconds){
      break;
    }
  }
}

Eu criei violino em: http://jsfiddle.net/6DQBP/

Roteiro retirado de: http://www.phpied.com/sleep-in-javascript/

Encontrei este URL depois de responder.Pode ser útil.

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top