父级的SlideToggle子类

问题描述

我想遍历pageHeadings中的每个div，将click函数应用于与标题"匹配的每个div.然后，如果单击标题，它将滑动切换标题的子类.

I want to loop through each div in pageHeadings, apply click function to each div that matches "heading." Then, if I click on a heading, it will slideToggle the heading's child class.

因此，如果我单击heading_about标题，它将滑动Toggles menu_about子类.

So, if I click on heading_about heading, it slideToggles menu_about child class.

我想念什么?

<div id="pageHeadings">
    <div id="heading_practice">                     
        <a href="#">
           <p>Practice Areas</p>
        </a>
        <div class="menu_practice">
           <p>test</p>
           <p>test2</p>
        </div>
    </div>
    <div id="heading_about">                        
        <a href="#">
           <p>About</p>
        </a>
        <div class="menu_about">
           <p>test</p>
           <p>test2</p>
        </div>
    </div>
 </div>

$("#pageHeadings div[id^=heading]").click(function () { //apply click function to all headings
    $('#' + this.id).children().slideToggle("fast"); 
   //should show child class (click heading_about, it shows menu_about)
   //instead shows child class, but also toggles heading
});

推荐答案

您可以使用与选择标题部分相同的技术，使用$(this).find并选择以'menu'开头的类的子级:

You can use the same technique as you did in selecting the heading part, use $(this).find and select the child with a class starting with 'menu':

$("#pageHeadings div[id^=heading]").click(function() {
    $(this).find('[class^=menu]').slideToggle("fast");
});

这篇关于父级的SlideToggle子类的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！