Question

<div class="contacts">
                <h3><a href="#">1st Link</a></h3>

                <div class="contacts-details">
                 <div class="tel" title="telephone">
                     <p>9806648110</p>
                        <p>9806648110</p>
                    </div>
                    <div class="fax" title="fax">
                     <p>9806648110</p>
                        <p>9806648110</p>
                    </div>

                    <div class="email" title="email">
                     <p>sonill_ss@hotmail.com</p>
                        <p>sanilshakya@gmail.com</p>
                    </div>

                    <div class="postal" title="postal">
                     <p>uttam chowk-10, pokhara, nepal</p>
                    </div>
                </div><!-- end .contacts-details -->
            </div><!-- end .contacts -->

            <div class="contacts">
               <h3><a href="#">2nd Link</a></h3>

               <div class="contacts-details">
                 <div class="tel" title="telephone">
                     <p>9806648110</p>
                        <p>9806648110</p>
                    </div>
                    <div class="fax" title="fax">
                     <p>9806648110</p>
                        <p>9806648110</p>
                    </div>

                    <div class="email" title="email">
                     <p>sonill_ss@hotmail.com</p>
                        <p>sanilshakya@gmail.com</p>
                    </div>

                    <div class="postal" title="postal">
                     <p>uttam chowk-10, pokhara, nepal</p>
                    </div>
                </div><!-- end .contacts-details -->
            </div><!-- end .contacts -->


            <div class="contacts">
                <h3><a href="#">3rd Link</a></h3>

                <div class="contacts-details">
                 <div class="tel" title="telephone">
                     <p>9806648110</p>
                        <p>9806648110</p>
                    </div>
                    <div class="fax" title="fax">
                     <p>9806648110</p>
                        <p>9806648110</p>
                    </div>

                    <div class="email" title="email">
                     <p>sonill_ss@hotmail.com</p>
                        <p>sanilshakya@gmail.com</p>
                    </div>

                    <div class="postal" title="postal">
                     <p>uttam chowk-10, pokhara, nepal</p>
                    </div>
                </div><!-- end .contacts-details -->
            </div><!-- end .contacts -->

当单击“h3 a”然后对其应用slideToggle（）时，如何选择h3的以下div（“.contacts-details”）？

请帮助

Answer 1

$('h3 a').click(function() {
    $(this).parent().siblings('div.contacts-details').slideToggle();
});

Answer 2

试试这个

$('h3 a').click(function(e) {
    e.preventDefault();
    $(this).parent().next('.contacts-details').slideToggle();
});

使用jquery选择所单击元素的以下div

2 个答案: