如何在另一個功能後彈出警報？

-2

<button id="hide" onclick="hide()">Hide</button> 
<p id="pb">This is a paragraph with little content.</p>

使命是，當我按一下按鈕，該段將在後面躲，然後再警報（）彈出。我嘗試了很多方法並繼續使用Google，但是我沒有任何改進。這是我最初的CS和JS代碼：

CSS：

.hide { 
    display: none; 
}

var button = document.getElementById("hide"); 
var p = document.getElementById("pb"); 
function hide(){ 
    p.classList.add("hide");    
    alert("The paragraph gone!"); 
}

隱藏（） - >警報彈出先款隱藏。這不是我想要的。謝謝！

來源

2016-09-28 Khanh Nguyen

爲什麼你想這樣做？ –

附加要求是我不允許使用setTimeOut函數。 –

@KhanhNguyen - 爲什麼不呢？ – Quentin

DOM正在立即更改，但瀏覽器正在等待，直到重新繪製顯示之前它沒有忙於運行JavaScript函數。

由於警報阻止了所有內容，因此它會繼續等待警報解除。

將代碼移動到setTimeout中即可解決該問題。下面的腳本

<script type="text/javascript"> 
    function hide() { 
     $("#pb").hide("slow", function() { 
      alert("The paragraph gone!"); 
     }); 
    } 
</script>

來源

2016-09-28 09:12:45 Quentin

使用hide事件學習More .SET一段時間延遲或快速。

無需隱藏Css。

function hide() { 
 
     $("#pb").hide(function() { 
 
      alert("The paragraph gone!"); 
 
     }); 
 
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<button id="hide" onclick="hide()">Hide</button> 
 

 
<p id="pb">This is a paragraph with little content.</p>

來源

2016-09-28 09:13:49

使用jQuery

p.classList.add("hide");    
setTimeout(alert.bind(null, "The paragraph gone!"));

來源

2016-09-28 09:41:05

謝謝！不幸的是，我的老師要求我使用普通的JS，沒有任何庫或setTimeOut函數 –

-1

您可以利用setTimeout（）的來解決這個問題。您可以先隱藏段落並使用setTimeout和警報消息。

<html> 
    <head> 
     <script> 
      function hide(){ 
       document.getElementById("pb").style.display = 'none'; 
       setTimeout(function(){ alert("The paragraph gone!"); }, 3000);   
      } 
     </script> 
    </head> 
    <body> 
     <button id="hide" onclick="hide();">Hide</button> 
     <p id="pb">This is a paragraph with little content.</p> 
    </body> 
</html>

來源

2016-09-28 09:45:50

那麼，我不允許使用setTimeout或jQuery。 :( –

如何在另一個功能後彈出警報？

回答

相關問題