Question

我有多个.listings-channel-rows，但只想在自己的父列表中显示/隐藏.listings-details-row。我认为我沿着正确的路线，但不能完全弄清楚语法。有什么帮助吗？

HTML：

<li class="listings-channel-row clearfix">
    <a href="#" class="listings-program toggle borderbottom">
        Back to the future 2 <span class="year">(1989
    </a>
    <li class="listings-details-row collapse-down">
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Numquam amet dolor accusamus itaque aspernatur exercitationem optio neque minima at nisi. Distinctio blanditiis vero porro saepe nesciunt explicabo deserunt aspernatur quasi.</p>
    </li>
</li>

jQuery的：

$(function () { 
    $(".toggle").on( "click", function () {
        $(this).parent().children('li').toggle('fast');
        $(this).toggleClass("borderbottom");
  });
});

Answer 1

您应该可以使用.next()

http://api.jquery.com/next/

$(this)
  .toggleClass("borderbottom")
  .next().toggle('fast');

Answer 2

试试这个

$(function () { 
    $(".toggle").on( "click", function() {
        $(this).siblings('.listings-details-row').toggle('fast');
        $(this).toggleClass("borderbottom");
    });
});

Answer 3

要选择孩子，您只需使用子选择器即可 $(".listings-channel-rows .listings-channel-rows")

或者如果您想选择您可以使用的直接孩子 $(".listings-channel-rows > .listings-channel-rows")

如何选择此项目？

3 个答案: