jQuery在5秒后将onclick隐藏后显示div

Question

嘿，所以我有一个div，我想在单击按钮后用一些文本替换，然后在5秒后重新显示相同的隐藏文本。 我被困在需要重新显示的部分。 我用onclick函数隐藏了div，并添加了一些文本，但是几秒钟后，我想重新显示原始文本。

这是我需要更改onclick文本的链接，然后在5秒钟后显示原始文本...

最初，文本显示为“添加到日历”，单击后应更改为“日历更新”，然后在5秒钟后更改回“添加到日历”。

<div class="resSubmitAction download resDetailsButton">
    <a href="javascript:void(0);">
</div>
<div class="calText"><p>add to calendar</p></div></a>
</div>

jQuery：

$(document).ready(function () {
     $(".resSubmitAction").click(function () {
         $(".calText > p").replaceWith("Calendar Updated");
     });
 });

Answer 1

利用setTimeout函数。 小提琴

$("#clickme").click(function(){
    var elem = $(this);
    setTimeout(function(){
        elem.hide();        
    }, 5000);
});

Answer 2

在您提供的代码中，click事件未正确附加，如果您单击“添加到日历”，则不会触发该事件。

您可以使用setTimeout函数在一定的时间延迟后调用任何函数，这是实现了setTimeout的代码。 小提琴

 $(".calText").click(function () {
     var originalText = $(".calText > p").text();
     $(".calText > p").text("Calendar Updated");

     setTimeout(function(){ 
             $(".calText > p").text(originalText) 
     }, delayTime);

     //Just a little timer I added
     triggerTimer();
 });