onclick JS関数の後に前のテキストを返す方法は？

Question

私のコードは次のとおりです。

function changeText() 
{ 
document.getElementById('button').innerHTML = 'Downloading...'; 
} 

ボタン：

<button id = "button" onclick='changeText()' value='Change Text'>Download file as CSV</button> 

私はボタンに変更したい「ダウンロード中...」その後、数秒後に「CSVとしてダウンロード」に戻り、ありますこれはJSで可能ですか？

Answer 1

あなたはsetTimeoutしたり、非同期呼び出しの成功をを使用することができます。

function changeText() { 
 
    document.getElementById('button').innerHTML = 'Downloading...'; 
 
    setTimeout(previousText, 1000); 
 
} 
 

 
function previousText() { 
 
    document.getElementById('button').innerHTML = 'Download file as CSV'; 
 
}

<button id="button" onclick='changeText()' value='Change Text'>Download file as CSV</button>

Answer 2

document.getElementById("your-button").value="Downloading..."; 
setTimeout(function() { 
    document.getElementById("your-button").value="Download as CSV"; 
}, 3000); 

上記のコードは、ボタンのテキストを設定し、3秒後にボタンテキストを別の文字列に設定します。

Answer 3

このコードは、2000ミリ秒後に、古いテキストを復元しますが、あなたがタイムアウトをカスタマイズすることができます。

function changeText() { 
    var button = document.getElementById('button'); 

    var oldText = button.innerHTML; 
    button.innerHTML = 'Downloading...'; 
    setTimeout(function(){ 
     button.innerHTML = oldText; 
    }, 2000); 
}