HTML5 jQuery更新在點擊事件中多次標記

Question

我嘗試做的事情：單擊一個按鈕，睡眠，將標簽更改為“運行”，睡眠，將標簽更改為“確定”

我有一個帶有單擊事件功能的按鈕（#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();     
    });
});

但是我只能看到最終的更新，看不到標簽的中間值。

有人可以幫助我嗎？

Answer 1

我已經進行了一些研究，發現使用setTimeout是比睡眠更好的方法

setTimeout(function(), delay)

這是我的小提琴代碼：

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

我最初嘗試過此方法：

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

但遇到的問題與您相同：顯示最后一個，而不顯示中間）。

我有一些艱難的時間試圖理解原因。 然后我將后面的一個更改為6000，然后得到了結果。 我相信兩個setTimeout都異步運行（不必等待代碼完成以完成其他任務）。 在這里查看更多詳細信息：

異步與同步執行的真正含義是什么？