Question

我正在尝试制作一个“下拉”菜单，您点击一个div，它下面的兄弟会变得可见或消失。它应该非常简单，但由于某些原因它给了我麻烦。

$(".dropDownClick").click(function(){
    alert($(self));
    $(self).next().css("display",(node.css("display")=="inline")?"none":"inline");
});

此代码返回[object Object]，然后不会更改下一个兄弟的显示css。经过一些测试后，我发现$(self).next();实际上会破坏代码（如果我尝试执行像alert($(self).next());这样的代码将无法执行）。我假设这是因为没有下一个兄弟姐妹？但我的HTML会暗示：

<div class="dropDownClick"><h1>Drop</h1></div>
<div class="dropDown" style="display: none;">
    <ul>
        <li>1</li>
        <li>2</li>
    </ul>
</div>

当我调用.next（）时，不应该选择类“dropDown”的div吗？

Answer 1

它应该是this不是自我，也可以使用.toggle（）而不是手动应用显示值

$(".dropDownClick").click(function () {
    $(this).next().toggle();
});

this是一个特殊变量，始终可用 - 但self / node是自定义变量，必须在使用之前声明，否则会抛出reference error

演示：Fiddle

JQuery不应该像它应该的那样

1 个答案: