Как исправить jquery accordin?

Sylon

Постоялец
Регистрация
1 Мар 2015
Сообщения
322
Реакции
153
Всем привет! Помогите, пожалуйста, новичку разобраться и понять, что в коде jquery не так, чтобы сделать его работающим. С меня много симпатий. Мучаюсь уже очень долго...:-(
Код:
<script>
    jQuery(function($){
        $(`.multi-accordion`).on('click', '.multi-accordion li > a', function (event) {
           var $this = $(this), $next = $this.next();
           if ($next.length) {
             $next.slideToggle().parent().siblings().children('ul').filter(':visible').slideToggle();
            event.preventDefault();
           }
        });
    });
</script>
Разметка Html является динамической, то есть может меняться в зависимости добавления новых категорий или удаления в админ-панели. Поэтому <ul> и <li> без классов.
Код:
<div>
    <ul class="multi-accordion">
        <li><a href="http://agestor.ru/category-id3/category-level1a.html">Category level 1 (a)</a>
            <ul>
                <li><a href="http://agestor.ru/category-id3/category-level1a/category-level2a.html">Category level 2 (a)</a></li>
                    <ul>
                        <li><a href="http://agestor.ru/category-id3/category-level1a/category-level2a/category-level3a.html">Category level 3 (a)</a></li>
                        <li><a href="http://agestor.ru/category-id3/category-level1a/category-level2a/category-level3b.html">Category level 3 (b)</a></li>
                        <li><a href="http://agestor.ru/category-id3/category-level1a/category-level2a/category-level3c.html">Category level 3 (c)</a></li>
                    </ul>
                <li><a href="http://agestor.ru/category-id3/category-level1a/category-level2b.html">Category level 2 (b)</a></li>
                <li><a href="http://agestor.ru/category-id3/category-level1a/category-level2c.html">Category level 2 (c)</a></li>
            </ul>
        <li><a href="http://agestor.ru/category-id3/category-level1b.html">Category level 1 (b)</a></li>
        <li><a href="http://agestor.ru/category-id3/category-level1c.html">Category level 1 (c)</a></li>
    </ul>
</div>
Итог манипуляций на сайте (боковое вертикальное меню) - Для просмотра ссылки Войди или Зарегистрируйся
 
Последнее редактирование:
Для начала, строка $(document).on('click', '.accordion li > a', function (event) { привязана к конкретному стилю, а именно .accordion, элементы которого отсутствуют в приведенном html коде. Класс .accordion, по всей видимости, должен быть назначен какому-то из элементов ul.
 
Понятно. Ну, во-первых, у вас там синтаксическая ошибка в используемых кавычках:
2fc83ff8f4.png

Во-вторых, привязка триггера черт знает к чему сделана. Возможно вот то, что вы ищите:

HTML:
jQuery(function($){
    $('.multi-accordion li > a').on('click', function (event) {
        var $this = $(this), $next = $this.next();
        if ($next.length) {
        $next.slideToggle().parent().siblings().children('ul').filter(':visible').slideToggle();
        event.preventDefault();
        }
    });
});
 
Спасибо большое, очень помогли!!! А насчёт триггера, я так понимаю это event, это сделано, чтобы проверять есть ли вложение если есть, то отключается ссылка.
Помогите, пожалуйста, прикрутить куки, вот код попытки, но он не работает.
Код:
<script>
        jQuery(function($){
            var openItem = false;
            if($.cookie('openItem') && $.cookie('openItem') != 'false'){
                var openItem = parseInt($.cookie('openItem'));
            }
            $('.multi-accordion').accordion({
                active: openItem,
                collapsible: true,
                autoHeight: false
            });
            $('.multi-accordion li > a').on('click', function (event) {
                $.cookie("openItem", $("#accordion").accordion("option", "active"));
                var $this = $(this), $next = $this.next();
                if ($next.length) {
                $next.slideToggle().parent().siblings().children('ul').filter(':visible').slideToggle();
                event.preventDefault();
                }
            $('.multi-accordion > li').click(function(){
                $.cookie('openItem', null);
                var link = $(this).find('a').attr('href');
                window.location = link;
            });
        });
</script>
 
Последнее редактирование:
Назад
Сверху