Jquery $(this) Child 选择器

我用这个:

jQuery('.class1 a').click( function() {
if ($(".class2").is(":hidden")) {
$(".class2").slideDown("slow");
} else {
$(".class2").slideUp();
}
});

页面结构:

<div class="class1">
<a href="...">text</a>
<div class="class2">text</div>
</div>

它只有在没有多个 class1/class2集合时才能工作，比如:

<div class="class1">
<a href="...">text</a>
<div class="class2">text</div>
</div>
<div class="class1">
<a href="...">text</a>
<div class="class2">text</div>
</div>
<div class="class1">
<a href="...">text</a>
<div class="class2">text</div>
</div>

如何更改初始 jquery 代码，使其仅影响被单击的 class1下的 class2？我尝试了 如何获取 $(this)选择器的子级？的建议，但没有成功。

234835 次浏览
小开
最佳答案

使用 HTML 的最佳方法可能是使用 next函数，如下所示:

var div = $(this).next('.class2');

因为单击处理程序发生在 <a>上，所以您也可以遍历到父 DIV，然后向下搜索第二个 DIV。你会做到这一点与 parent和 children的组合。如果您提供的 HTML 不完全是这样的，并且第二个 DIV 可能位于相对于链接的另一个位置，那么这种方法将是最好的:

var div = $(this).parent().children('.class2');

如果您希望“搜索”不仅限于直接的子级，那么您可以在上面的示例中使用 find而不是 children。

另外，如果可能的话，最好在类选择器前面加上标记名。也就是说，如果只有 <div>标签有这些类，那么选择器应该是 div.class1，div.class2。

小开

Http://jqapi.com/ 遍历—— > 树遍历—— > 儿童

小开

在 click 事件中，“ this”是被单击的标记

jQuery('.class1 a').click( function() {
var divToSlide = $(this).parent().find(".class2");
if (divToSlide.is(":hidden")) {
divToSlide.slideDown("slow");
} else {
divToSlide.slideUp();
}
});

有多种方法可以访问 div，当然你也可以使用. brothers，. next 等等

小开

对于 . slideToggle ()，这要简单得多:

jQuery('.class1 a').click( function() {
$(this).next('.class2').slideToggle();
});

编辑: 成为下一个而不是兄弟姐妹

Http://www.mredesign.com/demos/jquery-effects-1/

你也可以加上饼干来记住你所在的位置。

Http://c.hadcoleman.com/2008/09/jquery-slide-toggle-with-cookie/


提交答案