2015-11-06 61 views
0

一些時候,我嘗試做: 點擊一個按鈕,睡眠,改變標籤爲「運行」,睡眠,改變標籤「OK」Html5的jQuery的更新標籤上單擊事件

我有一個按鈕(#runajax)與點擊事件功能。 我有標籤的表:

<table class="table table-bordered"> 
    <tbody> 
     <tr> 
      <td >Status Global </td> 
      <td align="center"><label id="Status">FieldToUpdate</label></td> 
     </tr> 
    </tbody> 
</table> 

的Javascript:

function setStatusRun(runType) 
{ 
    $("#Status" + runType).text("running...."); 
} 

function setStatusOK(runType) 
{ 
    $("#Status" + runType).text("OK"); 
} 

$(document).ready(function() { 
    // initialize the viewer 
    $('#runajax').click(function (event) { 
     resetStatus(); 
     setStatusRun(""); 
     sleep(3000); 
     setStatusOK(""); 
     sleep(3000); 
     event.preventDefault();  
    }); 
}); 

但我只能看到最後的更新,而不是標籤的中間值。

有人可以幫助我嗎?

+0

什麼是'睡眠()'方法??? –

+0

我正在使用Chrome – user5023028

+0

函數sleep(毫秒)var start = new Date()。getTime(); if((new Date()。getTime() - start)> milliseconds){ break;(var i = 0; i <1e7; i ++){ if } } } – user5023028

回答

0

我身邊有做了一些研究,並找出使用的setTimeout比睡眠更好的辦法

setTimeout(function(), delay) 

這是撥弄我的代碼:

http://jsfiddle.net/mankinchi/0nubjp88/

我在第一次嘗試這樣做:

setTimeout(function() { 
     setStatus("run"); 
    },3000); 
setTimeout(function() { 
     setStatus("stop"); 
    },3000); 

但得到了同樣的問題,你h大道:顯示最後一個,而不是中間)。

我有一些艱難的時間試圖理解爲什麼。然後我將後面的一個更改爲6000,我得到了結果。我相信這兩個setTimeout都運行異步(不會等待代碼完成來執行其他操作)。看看這裏的更多詳細信息:

Asynchronous vs synchronous execution, what does it really mean?

+0

也許我不清楚,但我的問題不是關於睡眠或超時。我只是用它來模擬一些工作,沒有更多。我的問題在於標籤的更新。我沒有「中間」更新。 – user5023028

+0

@ user5023028再次閱讀。我還提到了我與你的結果相同的原因 –