2013-07-12 163 views
0

我試圖暫停在它執行中間的腳本,我如何做到這一點不沾它變成一個setTimeout的?問題是這只是代碼的一小部分,剩下的就是一大堆,並且通過將其粘貼到setTimeout中可能會引起混淆。暫停腳本執行

$.ajax({ 
    type: 'POST', 
    url: rAction, 
    data: rData, 
    success: function(msg){ 

    // BEFORE PROCEEDING TO THE FOLLOWING CODE, WAIT 5 SECONDS 
    wait(5000); //? 

    $('h1').hide(); 

    $('#result').html(msg); 
    $('#alertTxt').html($('#result .system-error-message').html()); 
    $('#alert').slideDown('fast'); 
    $('#regForm').slideUp('fast'); 
    $("html, body").animate({ scrollTop: 170 }, 600); 
    $('#but_submit').show(); 
    $('#processing').hide(); 

}); 
+0

我會給你的成功函數一個名字並將其移出ajax命令。然後你將函數中的代碼部分分解爲更多的命名函數。那麼你可以很容易地通過setTimeout來根據需要調用這些子部分。外功能提供了一個僞全球變量namepsace,其與從子功能閉合組合,可以很容易地管理跨越一個異步流狀態而不通常與回調相關聯的複雜的嵌套。 – dandavis

回答

0

將要在其他功能延遲代碼,然後傳遞函數的setTimeout。這應該讓你的「真實」的代碼很好和整齊。

function handleResponse() { 
    $('h1').hide(); 

    $('#result').html(msg); 
    $('#alertTxt').html($('#result .system-error-message').html()); 
    $('#alert').slideDown('fast'); 
    $('#regForm').slideUp('fast'); 
    $("html, body").animate({ scrollTop: 170 }, 600); 
    $('#but_submit').show(); 
    $('#processing').hide(); 
} 

$.ajax({ 
    type: 'POST', 
    url: rAction, 
    data: rData, 
    success: function(msg){ 

    // BEFORE PROCEEDING TO THE FOLLOWING CODE, WAIT 5 SECONDS 
    setTimeout(function() { 
    handleResponse(msg); 
    }, 5000); 
}); 
+0

有很多是需要傳遞變量...並在此函數執行完畢後,它仍然發射更多的腳本,並通過變量...變得非常令人費解。 – Damien

+0

將您的代碼分解爲更短的函數可以更輕鬆地跟蹤事物。還要記住,JavaScript是單線程的,所以你不應該停止瀏覽器5秒。 –

+0

單線程是什麼意思? – Damien

0

...我如何做到這一點不沾它變成一個setTimeout的?

您可以使用web workers作爲長時間運行的複雜代碼,您不希望退回到瀏覽器。該代碼不能直接修改DOM,但它可以將消息發回主腳本,告訴主腳本要更改什麼。

在不支持網絡工作者的瀏覽器,你基本上沒有什麼選擇,只能產生回(setTimeout和它的表兄弟)。

你可以在網上找到各種網絡工作者的例子,但爲了什麼是值得的,這裏是我做的for another answer here,它只顯示了計數到大量的進展。但是概念是一樣的:長時間運行的腳本與主JavaScript線程分開運行,並通過postMessage向其發佈更新。

主要文件和腳本:

<!doctype html> 
<html> 
<head> 
<meta charset="UTF-8"> 
<title>Progress</title> 
<style type="text/css"> 
body, html { 
    height: 100%; 
} 
body { 
    font-family: sans-serif; 
} 
</style> 
</head> 
<body> 
<div id="progress"><em>(Click to start)</em></div> 
<script> 
(function() { 
    var div = document.getElementById("progress"); 
    var counter = new Worker("counter.js"); 

    div.addEventListener("click", run); 

    counter.addEventListener("message", function(event) { 
    div.innerHTML = "Counter so far: " + event.data.counter; 
    }); 

    function run() { 
    div.removeEventListener("click", run); 
    counter.postMessage({ max: 10000000 }); 
    } 
})(); 
</script> 
</body> 
</html> 

counter.js網絡工作者腳本(他們總是單獨的文件):

self.addEventListener("message", function(event) { 
    var max; 
    var counter; 

    max = event.data && event.data.max || 100000; 
    for (counter = 0; counter < max; ++counter) { 
    if (counter % 1000 === 0) { 
     self.postMessage({counter: counter}); 
    } 
    } 
    self.postMessage({counter: counter}); 
}); 
-1

爲什麼不把它放在一個函數並調用與setTimeout的那個函數(func,5000)?

+1

超過一半的問題文字是*說*爲什麼不。 –

+0

我真的沒有看到將它放入$ .ajax()函數或在不同的函數中的區別。不容易混淆恕我直言。 – Tdelang