Question

我有几个不同的div，看起来都像这样。

$(document).ready(function() {
  $(".show").click(function() {
    $(".show").parent().(".text").toggle();
  });
});

<div class="container #{i}">
    <div class="show">
        show
    </div>

    <div class="text">
        text text text
    </div>
</div>

我希望能够点击show，并让它只切换容器div中的文本div。我以为我可以用类＆＃34; show＆＃34;抓住元素的父元素。我点击了，这将是容器+索引，然后获取名为＆＃34; text＆＃34;的子类。在那个容器div。

这说实话感觉相当微不足道，但我在Javascript方面还不是很有经验，而且我不确定要搜索的措辞。我非常感谢任何帮助。：）

Answer 1

找到了

的功能

$(document).ready(function() {
  $(".show").click(function() {
    $(this).parent().find(".text").toggle();
  });
});

Answer 2

您可以使用siblings函数来获取/过滤同一级别的元素：

jQuery('.show').click( function () {
   jQuery(this).siblings('.text').toggle(); 
});

更多信息：http://api.jquery.com/siblings/

Answer 3

您非常接近，您只需要在父级上调用“查找”并替换.show的{{1}}选择器，因为您只想在当前内部切换this div （这）父母而不是全面。所以你需要这样的东西：

.text

或另一种选择（虽然其他人已发布）

$(document).ready(function() {
  $(".show").click(function() {
    $(this).parent().find(".text").toggle(); //replaced .show for this
  });
});

但是，为了使上述工作正常，两个div（.show和.text）必须处于同一级别，而$(".show").siblings(".text").toggle();即使find嵌套在另一个元素内也会找到它。 / p>

Answer 4

你不应该抓住父母......

$('.show').click(function() {
    $(this).next().toggle()
});

应该有效。只是抓住兄弟姐妹。

Answer 5

你可以在里面尝试这个.click功能

$(this).parent().find("text").toggle();

如何使用父/子在javascript中选择正确的div

5 个答案: