自动关闭模态窗口，或单击关闭

Question

我有一个工具提示出现，我想在 1500 毫秒后自动关闭，或者如果用户单击页面上的任何位置，则立即关闭。

我尝试了以下方法：

$('#action-result').fadeIn('fast').delay(1500).fadeOut('fast');
$('body').click(function(){

    $('#action-result').fadeOut('fast');

});

但无论出于何种原因，延迟似乎已完全控制，并且在延迟结束之前不允许该元素发生任何其他事情。

---

编辑

感谢 Ohgodwhy 和 ThiefMaster，我唯一需要对 click 函数做的就是添加一个 stop 来清除之前触发的 .delay()。

$('body').click(function(){

    $('#action-result').stop().fadeOut('fast');

}); 

Answer 1

不要使用延迟，使用 setTimeout。

$('#action-result').fadeIn('fast', function(){
  //callback for after fadeIn completes
  setTimeout(function(){
    $(this).fadeOut('fast');
  }, 1500);  //1500 is our delay
});

清除点击超时。

$('body').click(function(){
  window.clearTimeout(); //timer cleared, now let's fadeOut.
  $('#action-result').fadeOut('fast');
});

Answer 2

以下应该实现所需的功能：

var x = setTimeout(function () { $("#action-result").fadeOut("fast"); }, 1500);
$("body").click(function () {
    $("#action-result").fadeOut("fast");
    clearTimeout(x);
});