Вопрос

Итак, у меня на странице есть несколько контейнеров с этой разметкой:

        <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 div .box-content перемещался вверх или вниз (переключался).

Вот jQuery, который я использую, я пытаюсь добиться этого с помощью close():

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

Но почему-то не работает :(

Это было полезно?

Решение

Попробуй это:

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

При этом выбирается следующий брат родительского элемента div, но не используется ближайший.

Другие советы

Ближайший() находит закрывающий родительский элемент.В вашем случае диапазон не имеет родительских элементов с классом .box-content.почему бы просто не сделать $('.box-content').slideToggle('slow');??

редактировать:я пропустил ту часть, где их несколько на странице.родительский().next должен работать.

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top