javascript - 使用点击事件淡入和淡出隐藏的div

Question

我目前正在尝试学习 jquery 的基础知识，并且希望获得一些有关如何实现以下目标的建议。

当我单击“下拉”链接时，隐藏的链接列表会淡入，当我单击页面的任何部分(#innerList 标记除外)时，隐藏的列表会淡出，或者如果我单击其中一个链接，则隐藏的列表会淡出。隐藏的链接然后列表也会淡出。

我目前的努力在这里http://jsfiddle.net/kyllle/b6XC4/

如果能获得一些关于如何实现这一结果的建议，那就太好了。

Answer 1

如果将 JS 更改为以下，您将获得所描述的效果。

var innerList = '#innerList';

    $(innerList).hide();

    $('a.mainButton').click(function(e) {
        $(innerList).fadeIn('slow');
        e.stopPropagation();
    });
    $(document).click(function(e){
        $(innerList).fadeOut('slow');
    });

此外，我建议将标签 href 更改为“#”以进行测试或完全删除 href。

创建了 jsfiddle .