尝试淡出时会重复 FadeIn 和 FadeOut答案

【问题标题】：FadeIn and FadeOut repeats when try to fade out尝试淡出时会重复 FadeIn 和 FadeOut
【发布时间】：2013-01-12 23:51:48
【问题描述】：

这可能很容易解决，我错过了一些明显但无法真正找到它的东西。

当我点击背景封面时，我希望 div 歌曲标题淡入背景覆盖，它工作得很好，但是当我点击 div 歌曲标题时，我希望歌曲标题淡出，这就是问题的开始。

我尝试了几种不同的方法来解决这个问题，但都没有成功。问题是，当我单击歌曲标题 div 时，它会按原样淡出，但半秒钟后它又会淡入，我无法解决这个问题。

$(".backgroundcover").click(function() { 
    $(".songtitle").fadeIn("fast");
});

$(".songtitle").click(function() { 
    $(".songtitle").fadeOut("fast");
});

如果我把它改成这个，它工作得很好，但只有一次，所以我只能淡入 div 一次！

$(".backgroundcover").click(function() { 
    $(".songtitle").fadeIn("fast");
});

$(".songtitle").click(function() { 
    $(".songtitle").fadeOut({opacity : 0}, 400);
});

还有 HTML：

<div class="backgroundcover">
    <div class="songtitle"><a href="#">Hejsan testar</a>Destiny's child - Unknown</div>
</div>

【问题讨论】：

请显示等效的 HTML。也许这有问题？
无关，但你应该缓存$(".songtitle")选择器

标签： jquery fadein fadeout

【解决方案1】：

这种行为的原因是.songtitle click 事件的处理程序允许事件冒泡到它的父级，这导致.backgroundcover 处理程序也被调用（这会使文本淡入）。

当您使用 jQuery 时，您可以通过从处理程序返回 false 来阻止事件传播：

$(".songtitle").click(function() { 
    $(".songtitle").fadeOut({opacity : 0}, 400);
    return false;
});

你可以看到working example here。

【讨论】：

非常感谢！ return false 做到了！