如何显示和隐藏div与时间和单击选项隐藏包括？

Question

我有一个display: none;的div我要显示它，然后在5 seconds隐藏它，但如果用户点击div，它一旦点击就会消失。似乎我不能同时消失并点击选项。

这里的代码。

$('#div').fadeIn();
$('#div').delay(5000).fadeOut();
$('#div').click(function(){
    $(this).fadeOut();
});

如果我拿出$('#div').delay(5000).fadeOut();，它会在我点击之前消失。

如果我拿出$('#div').click(function(){ $(this).fadeOut(); });当用户点击它时它就不会消失。

其他信息

如果我在点击代码之前或之后添加此$('#div').delay(5000).fadeOut();，那就是问题。 div将等待5秒，div将无法点击。

Answer 1

这应该做你想要的。

$('#div').fadeIn();
timerId = setTimeout(function(){
    $('#div').fadeOut();
}, 5000);
$('#div').click(function(){
    $(this).fadeOut();
    clearTimeout(timerId);
});