使用相同类名的 jQuery 元素如何进行具体定位？

Question

可能重复：
如何在jQuery中使用“this”选择器选择类内的元素 我对jQuery还不很熟悉...我想这与使用“this”命令有关，但不确定。

我有一个页面，它是通过编程方式创建几个像这样的div：

<div class="moreinfolink">Click For More Information
<div class="moreinfotext">Additional Info Here</div>
</div>

页面上有几个 .moreinfolink 和 .moreinfotext 类。

我使用了以下代码来切换显示 moreinfotext div：

$('.moreinfolink').click(function() {
  $('.moreinfotext').toggle('slow', function() {
  });

但是这显然会切换页面上所有存在的moreinfotext div。

两个问题： 如何仅针对位于父moreinfolink div内的特定子div执行此操作？ 是否有比我现在做的更好的方法？

谢谢！

- Chris Cummings

Answer 1

你可以使用.find方法（正如@FelixKling所建议的那样）：

$('.moreinfolink').click(function() {
    $(this).find('.moreinfotext').toggle('slow', function() { ... });
});

Example: http://jsfiddle.net/hejFq/

- Andrew Whitaker

---

在内部，$('.moreinfotext', this) 调用了 $(this).find('.moreinfotext')，因此您可以直接使用后者。 - Felix Kling

@FelixKling：你说得对，我想直接调用find会更好。 - Andrew Whitaker

搞定了！我在这里使用HTML的方式是最好的方法还是有更好的方法？ - Chris Cummings

@ChrisCummings：我认为这种方法很好，特别是如果你对自己正在处理的标记没有真正的控制。 - Andrew Whitaker

Answer 2

这个示例展示了如何做到：http://jsfiddle.net/ZAwTL/

或者这个示例, 展示了直接调用find()方法，就像Felix Kling建议的那样。

示例HTML代码

<div class="moreinfolink">Click For More Information
<div class="moreinfotext">Additional Info Here</div>
</div>
<br>
<br>
<div class="moreinfolink">Click For More Information
<div class="moreinfotext">Additional Info Here</div>
</div>
<br>
<br>
<div class="moreinfolink">Click For More Information
<div class="moreinfotext">Additional Info Here</div>
</div>

JavaScript

$('.moreinfolink').click(function() {
  $(this).find('.moreinfotext').toggle('slow', function() { });
});

- Tim M.

Answer 3

$('.moreinfolink').click(function() {
  $(this).children('.moreinfotext').slideToggle('slow');
});

我删除了你的空函数...可能是因为提供的信息不足以支持它，或者它是错误的。

- Scott