Dashboard: fornecendo feedback do usuário, alterando etiqueta do botão

Question

O que eu quero é fornecer feedback do usuário sobre o estado de funcionamento através de etiqueta do botão. Inicialmente o botão diz "salvar", uma vez clicado eu quero mudar o rótulo para "salvar ..." entrar em outra função e uma vez que a função retorna alterar o rótulo de "salvo", em seguida, fazer uma pausa de 2 segundos e definir o rótulo novamente para inicial " salvar" valor.

Aqui está o código:

function myClickHandler(event)
{   
    document.getElementById("button").object.textElement.color = "saving...";
    functionx ()
    document.getElementById("button").object.textElement.color = "saved";
    sleep (5000);
    document.getElementById("button").object.textElement.color = "save";
}

O problema é que, por algum motivo apenas o último document.getElementById("button").object.textElement.color = "save"; é realmente visível na tela, porque a tela ou a tecla são processados ??apenas uma vez eu sair da função myClickHandler. Qualquer dica?
Agradecemos antecipadamente

Answer 1

Algo como este trabalho poder melhor. Tenho certeza setTimeout é non-blocking.

function myClickHandler(event) {
    updateLabel("saving...");
    setTimeout("performFunctionX()", 250);
}

function performFunctionX() {
    functionx;()
    updateLabel("saved");
    setTimeout("updateLabel('save')", 5000);
}

function updateLabel(labelText) {
    document.getElementById("button").object.textElement.color = labelText;
}