Javascript задержавшись скрипт меняет порядок появления

Question

у меня есть следующий сценарий:

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

время устанавливается на 3000 милисекунд. моя проблема в том, что я хочу опубликовать() функцию, чтобы показать таблицу на экране (ее вид экрана загрузки), а затем приостановить сценарий. Фактически, по какой-то причине сценарий сначала приостанавливается, и только после того, как он заканчивается, он показывает мне экран загрузки ... как получилось?

Answer 1

браузеры запустить JavaScript и рендеринга все в одном потоке. Таким образом, все три функции JS будут завершены до обновления страницы. Вот почему вы должны never реализовать функцию паузы в JS, которая основана на цикле while и проверяет время. Вместо этого вам нужно использовать setTimeout() и поместить любой код, который необходимо запустить после паузы в обратном вызове, который вы передаете setTimeout().

Использование Пример кода:

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

Answer 2

В собственном javascript нет функции ожидания или паузы. Но мы можем добиться такого.

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

Я создал скрипку по адресу: http://jsfiddle.net/6DQBP/

Сценарий взят из: http://www.phpied.com/sleep-in-javascript/

Я нашел этот URL, после того, как я ответил. Может быть полезно.

• http://www.sean.co.uk/a/webdesign/javascriptdelay.shtm
• Sleep in Javascript - delay between actions