Создание аккордеона для WordPress с JQuery, нужна помощь!

Question

Я создаю аккордеон для WordPress и не могу понять, что я делаю неправильно.

В конечном итоге я пытаюсь скрыть дочерние элементы, и когда родитель будет активирован, появится дочерний элемент.

JS:

<script>
    $(document).ready(function() { //hide child page
        $('#content ul.menu ul li').hide();
        //when navigate to a child page show all pages
        $('#content ul.menu li.current-menu-item').parent("ul").show();
        //show page list when toggle
        $('#content ul.menu ul li.active ul').show();
        //show cerrent page's child page
        $('#content ul.menu ul li.current-menu-item ul').show();

        $('#content .menu ul li').click(function() {
            $(this).addClass("active");
            $(this).children('ul').slideToggle("slow");
        });
    });
</script>

Сайт: www.svadsi.info

Заранее спасибо.

Answer 1

Wordpress не всегда хорошо сочетается с jquery.

Сначала вы хотите заключить код в

$(function() {

вместо

$(document).ready(function() {

Кроме того, я бы рекомендовал использовать

.addClass('hidden');

и

removeClass('hidden');

вместо .hide (); и .show (); при решении той же проблемы.

Пожалуйста, не стесняйтесь оставлять комментарии, и я помогу вам устранить неполадки.

Answer 2

Можете ли вы объяснить вашу проблему, пожалуйста?

Вы должны поймать событие click на li, потому что оно всплывает

    $('#content .menu ul li').click(function(e) {
        $(e).stopPropagation();
        $(this).addClass("active");
        $(this).children('ul').slideToggle("slow");
    });