更改HTML元素（div）的內容幾秒鐘

我有一個功能可以在一個按鈕上執行click事件。點擊後，它顯示我的消息「電子郵件已發送！」代替形式。更改HTML元素（div）的內容幾秒鐘

5秒鐘後，此消息消失並且沒有任何剩餘。如何在5秒後將原始內容重新設置爲div？以下是我的片段。

function myFunction() { 
    document.getElementById("form").innerHTML = "Email was send!"; 
    setTimeout(function() { 
     document.getElementById('form').style.display = 'none'; 
    }, 5000); 
}

我想顯示我的消息5秒鐘，然後回到原始表單內容。

來源

2016-07-15 Adrian

你應該留在你的表格上。只需在頁面上添加成功消息，並在5秒後消失。 – CoderBoy

您應該將成功消息放在單獨的元素中，並隱藏一個並顯示另一個元素，而不是暫時替換該表單。 –

您是否嘗試在分配新值之前存儲您的innerHTML？然後畢竟你可以用這個存儲的值再次設置innerHTML，而不是設置display none。 – Berkay92

您可以先將innerHTML保存到變量中，然後再將其設置回去。這就是我的意思：

function myFunction() { 
    var form = document.getElementById("form") 
    var originalContent = form.innerHTML 
    form.innerHTML = "Email was sent" 
    setTimeout(function() { 
    form.innerHTML = originalContent 
    }, 5000) 
}

沒有必要將顯示設置爲無，這將完全隱藏窗體。

來源

2016-07-15 10:28:18 Lew

再試一次，我錯過了在超時時間內的大寫'F'。我糾正了這一點。 – Lew

你可以在你的新內容中添加一個範圍，並添加一個如下所示的類：form.innerHTML =「電子郵件已發送」 – Lew

嗯，這裏沒有代碼發送電子郵件，如果你有一個單獨的函數，你應該從這個函數中調用它。 – Lew

因爲您正在設置不顯示任何表單按鈕。

來源

2016-07-15 10:27:08 Abhay

請詳細說明或作爲評論。 – Rohit416

要做你在問什麼，你只需要存儲表單的內容，然後用電子郵件替換它，然後在超時時恢復它們。將窗體的顯示設置爲none只是隱藏元素而不更改內容。

例如

function myFunction() { 
    var old_html = document.getElementById("form").innerHTML; 
    document.getElementById("form").innerHTML = "Email was send!"; 
    setTimeout(function(){ 
     document.getElementById('form').innerHTML = old_html; 
    }, 5000); 
}

雖然這應該解決您的問題，我建議把電子郵件在一個單獨的元素，隱藏/顯示是必要的。如果你只是在五秒鐘後把它放回去，那麼替換表單內容並沒有什麼意義。

來源

2016-07-15 10:32:17

<script> 
function myFunction() { 
     var originalContent = document.getElementById("form").innerHTML; 
     document.getElementById("form").innerHTML = "Email was send!"; 
     setTimeout(function() { 
        document.getElementById('form').innerHTML = originalContent; 
       }, 5000); 
    } 
</script>

來源

2016-07-15 10:35:34

更改HTML元素（div）的內容幾秒鐘

回答

相關問題