jQuery Cookies с несколькими меню SlideToggle - PullRequest
Новая
       22

jQuery Cookies с несколькими меню SlideToggle

1 голос
/ 03 ноября 2011

У меня есть несколько меню, которые используют .slideToggle (я изучаю jQuery в настоящее время). Используя онлайн-учебники и другие интересные ресурсы, я думаю , что я должен работать над тем, чтобы запомнить состояние моих меню slideToggle независимо от того, где они находятся на сайте. На данный момент существует четыре меню, которые могут меняться случайным образом по мере внесения изменений на сайт. Вот структура меню: 

<aside class="widget">
<h2 class="trigger">Blog Topics</h2>
<ul id="menu-blog-topics" class="menu">
<li></li>
</ul>
</aside>

<aside class="widget">
<h2 class="trigger">Wordpress</h2>
<ul id="menu-wordpress-3" class="menu">
<li></li>
</ul>
</aside>

И мой JQuery: 

function initMenu() { 
    $('ul.menu').hide(); 
    $('h2.trigger').click( 
            function() { 
                    $(this).next().slideToggle('slow',function(){ 
                            var id = $(this).attr('id'); 
                            if ($(this).is(':hidden')) { 
                                    var state = "closed"; 
                            } else if ($(this).is(':visible')) { 
                                    var state = "open"; 
                            } 
                            return false; 
                     }); 
            } 
    ); 
} 

jQuery(document).ready(function() {initMenu();});

SlideToggle работает правильно. Состояние просто не запоминается от страницы к странице.

1 Ответ

2 голосов
/ 04 ноября 2011

Вам просто не хватает строк для хранения и получения куки. 

function initMenu() {   
    $('ul.menu').hide();   

    $('h2.trigger').click(   
        function() {   
            $(this).next().slideToggle('slow', function() {   
                var id = $(this).attr('id');   
                $.cookie(id, $(this).is(':hidden') ? "closed" : "open"); 
                return false;   
            });   
        }   
    ); 

    $('h2.trigger').each(function() { 
        var id = $(this).next().attr('id'); 
        if ($.cookie(id) == "open")  $(this).next().show(); 
    }); 
}

jQuery(document).ready(function() {initMenu();});

Вы можете проверить это здесь: http://jsfiddle.net/GZmHY/9/

...