Question

我正在使用jQuery淡出我构建的“通知”泡泡。第一次调用该函数时它会逐渐淡出，但第二次将“通知”附加到正文，但只是坐在那里并且不会淡出。任何帮助将不胜感激。

以下是正在调用的Javascript。

    if (pointsCalculated = 1) {
    $('body').append('<div id="progress">' + pointsCalculated + ' point added to current points...</div>');
}
else {
    $('body').append('<div id="progress">' + pointsCalculated + ' points added to current points...</div>');
}

//Reset calculator after adding to tracker
calcReset();

    $("#progress").fadeOut(2000);

Answer 1

尝试删除fadeOut之后的元素：

$("#progress").fadeOut(2000, function() { $(this).remove(); });

更多信息：

.remove()
.fadeOut()

Answer 2

Javascript找不到一个带ID的元素，当你想再次运行它时它已经淡出了。

你可以将id更改为一个类，然后找到所有可见且没有动画的.progress来启动该项目的fadout，当它完成时你可以删除它，所以你不需要很多.progress

$('body').append('<div class="progress">' + pointsCalculated + ' ' + (pointsCalculated === 1 ? 'point' : 'points') + ' added to current points...</div>');

//Reset calculator after adding to tracker
calcReset();

$(".progress:visible:not(:animated)").fadeOut(2000, function() { $(this).remove(); });

记住在javascript中如果你想看一个变量是一个值，你需要使用至少两个“=”否则你会将值设置为该变量。

Answer 3

每次附加fadeOut事件时，都需要将fadeOut事件重新绑定到#progress元素。

Answer 4

将元素添加回DOM时，必须重新创建附加元素fadeOut binding。您可以在追加后立即创建此绑定，现在应该可以使用。

Answer 5

您的代码没有显示您正在删除“进度”，因此您每次都可能添加一个新代码。由于ID非常独特，因此您的代码会找到两个并失败。

jQuery fadeOut（）只能工作一次

5 个答案: