在单击时停止 FadeIn 动画并在单击时停止 FadeOut

Question

我在单击时停止淡入动画时遇到问题。按下按钮时会发生什么情况，动画淡入但 2 秒后淡出。下面是我的代码，我不知道如何在点击时停止淡入，然后在点击时停止淡出。

$(document).ready(function () {
    $("#toggle").click(function () {
        $("#menu").fadeIn("slow");
    });
    $("#toggle").click(function () {
        $("#menu").fadeOut("slow");
    });
});

http://jsfiddle.net/f2z6bxk5/

Answer 1

#toggle 元素上的click 事件被绑定两次，点击时两个处理程序都会运行。

将fadeToggle 与stop 一起使用

Updated Fiddle

$(document).ready(function () {
    $("#toggle").click(function () {
        $("#menu").stop(true, true).fadeToggle("slow");
    });
});