jquery - jQuery：单击按钮时显示/隐藏下拉菜单

Question

当我点击一个按钮时，我想打开一个下拉菜单。

我尝试了很多代码，但最接近的是以下代码：

<input id="hide" value="+" type="button" />

$(document).ready(function () { 

    $('#hide').click(
        function () {
            //show its submenu
            $('rightMenu', this).stop().slideDown(500);

        }, 
        function () {
            //hide its submenu
            $('rightMenu', this).stop().slideUp(500);          
        }
    );

我要显示/隐藏的菜单位于<div id="rightMenu">.

Answer 1

$('rightMenu', this)是相同的$(this).find("rightMenu")

因此，这将搜索带有标签的元素，该标签rightMenu嵌套在您的hide输入元素中。

这显然是不对的，因为您的元素中没有嵌套任何元素input，并且几乎可以肯定不会有任何rightMenu元素，因为这是无效类型。

菜单在 div rightMenu 中。

查看您对此答案的评论，您的选择器实际上应该是：

$("#rightMenu")

此外click()不能接受 2 个参数。而是将其更改为 1 功能并用于slideToggle()在 Up 和 Down 之间交替。

因此，您的代码应该是：

$(document).ready(function () { 

$('#hide').click(
    function () {
        //show its submenu
        $("#rightMenu").stop().slideToggle(500);    
    }
);

});

现场演示：http: //jsfiddle.net/7aCFk/

Answer 2

你能用slideToggle试试吗

 $('#hide').click(
    function () {
    //show its submenu
    $('.rightMenu').slideToggle(500);

}
);