مسمير الأقرب () مساعدة

Question

لذلك لدي العديد من الحاويات مع هذه العلامة في الصفحة:

        <div class="box w400">
            <div class="box-header">
                <span class="expand-collapse">expand/collapse</span>
                <h3>Heading</h3>
            </div>
            <div class="box-content">
                <p>Some content here...</p>
            </div>
        </div>

وأنا أحاول تحقيق ذلك بعد النقر فوق expand-collapse span، سوف ينزلق div المحتوى .box لأعلى أو لأسفل (تبديل).

هنا هو المسج الذي أستخدمه، أحاول تحقيق ذلك مع الأقرب ():

        $(document).ready(function() {
            $('.expand-collapse').click(function() {
                $(this).closest('.box-content').slideToggle('slow');
            });
        });

لكنها لا تعمل لسبب ما :(

Answer 1

جرب هذا:

$(document).ready(function() {
    $('.expand-collapse').click(function() {
        $(this).parent().next('.box-content').slideToggle('slow');
    });
});

يحدد ذلك الأخوة التالية من DIV الأصل، فإنه لا يستخدم الأقرب.

Answer 2

أقرب () يجد العنصر الأصلي إغلاق. في حالتك، لا تملك الأمان أي عناصر أوديا مع محتوى Class .Box. لماذا لا تفعل فقط $ ('. محتوى المربع'). slidetoggle ("بطيء")؛ ؟

تحرير: فاتني الجزء حيث لديك العديد من هذه في الصفحة. الوالد (). يجب أن تعمل المقبل.