使用jQuery的"this"加上CSS选择器？

Question

我正在编写一个脚本来显示/隐藏一个 div 中的部分内容。我有 3 个这样的 div，每个都有隐藏的部分，但希望使用一个函数控制所有 3 个。

目前我的代码如下：

$('.rates, .hours, .otherinfo').click(function() {
    $('.expand').toggle();
});

这是HTML代码：

<div class="rates">
    <h2>Rates</h2>
    <div class="expand">
        <p>Text in here is hidden by default.</p>
    </div>
</div>
<div class="hours">
    <h2>Hours</h2>
    <div class="expand">
        <p>Text in here is hidden by default.</p>
    </div>
</div>
<div class="otherinfo">
    <h2>Other Info</h2>
    <div class="expand">
        <p>Text in here is hidden by default.</p>
    </div>
</div>

还有CSS：

.expand {
    display:none;
}

显然，当您单击它们中的任何一个时，这会显示所有3个div的“expand” div。有没有一种方法将this纳入选择器中。类似于this'.expand'？

谢谢！

- APAD1

---

你是想要仅扩展被点击的元素吗？ - Mario J Vargas

给它一些上下文。请显示相应的HTML标记。参见：http://stackoverflow.com/help/mcve - Sparky

@user3388636的回复对我有用，但我会添加HTML以供其他人参考。谢谢！ - APAD1

是的，谢谢。"为他人提供参考"确实是SO的重点。 - Sparky

Answer 1

$(this).find('.expand').toggle()

- Nick

---

$(".expand", this) 简而言之是指在当前上下文环境中选择 class 名为 "expand" 的元素。 - GillesC

Answer 2

您应该添加一个Fiddle以获得更好的答案。但是类似以下代码可能会起作用：

$("#something").click(function(){$(this).children("section").toggle();});

- Mark