Question

这可能很容易修复，我错过了一些显而易见但却无法真正找到它的东西。

当我点击backgroundcover时，我希望div songtitle fadeIn over backgroundcover，它工作得很好但是当我点击div songtitle时我想要歌曲fadeOut，这就是问题的开始。

我尝试了几种不同的方法来解决这个问题，但没有成功。问题是，当我点击songtitle 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>

Answer 1

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

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

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

您可以看到working example here。

尝试淡出时，FadeIn和FadeOut重复

1 个答案: