0

私は（非常に）謙虚なjQueryのハックな方法で以下をまとめました：

$(".toggle_container").hide();
                $(".trigger a").addClass("close");
                $(".trigger a").click(function() {
                $(".toggle_container").slideUp('200','swing');
                 $(".trigger a").removeClass("open").addClass("close");
                    if     ($(this).next(".toggle_container").is(":hidden")) {
                            $(this).next(".toggle_container").stop(true,false).slideToggle('200','swing');

                        }
                });

jsfiddle はこちら: http://jsfiddle.net/FWzWu/8/

jquery cookie プラグインを使用したことはありませんが、ユーザー メニューの状態をページごとに記憶するために使用したいと考えています。ここで github プラグインを使用: https://github.com/carhartl/jquery-cookie

どんな助けでも大歓迎です！ありがとう！

4

2 に答える 2

1

最初の刺し傷event.preventDefault()（クリック時にデフォルトのアンカーアクションが発生しないようの呼び出しを追加しました

たとえば、イベント デリゲーションを利用してアンカー要素のクリック イベントをキャプチャするとよいでしょう。うまくいけば、プラグインの使用方法と使用場所を伝えることができます。

 $(function () {   

    // give each container a unique class
    var containers = $("ul.toggle_container").hide().each(function (i,v) {
        $(this).addClass('container_' + i);       
    });

    var value = $.cookie('toggled_container');     

    // if we have a value in the cookie, use it to show that container
    if (value) {
        $('ul.' + value).show();
    }

    var anchors = $("li.trigger a");

    anchors.addClass("close").click(function() {
        containers.slideUp('200','swing');
        anchors.removeClass("open").addClass("close");
        var nextContainer = $(this).next("ul.toggle_container");
        if (nextContainer.is(":hidden")) {
            // capture the unique class that we have given the container
            $.cookie('toggled_container', nextContainer.attr('class').match(/container_\d+/));
            nextContainer.stop(true,false).slideToggle('200','swing');
        }
    });
});

明らかに、このソリューションは、コンテナーの数と順序が決して変更されないことを前提としています。もしそうなら、ページの読み込み時に間違ったコンテナが展開されることになります:)

于 2012-01-10T00:01:52.317 に答える
0

あなたがリストしたページ（githubのもの）にはreadmeがあります、私はプラグインを使ったことがありませんが、それは十分に単純に見えます。

スクリプトを必ず含めてください。

<script src="/path/to/jquery.cookie.js"></script>

これで、Cookieの値を変更する（または最初にCookieを作成する）たびに、を使用します。

$.cookie('cookie_name', 'cookie_value', { expires: 7 });

*cookie_name*と*cookie_value*を好きなように変更します。例えば

$.cookie('nav_choice', '1', { expires: 7 });

次に、ページをロードするたびに、これをdocument.ready内で実行します。

var nav = $.cookie('nav_choice');

次に、if（）ステートメントを実行して、何を表示するかを決定できます。

これは役に立ちますか？必要に応じて詳しく説明します。

于 2012-01-09T23:51:39.310 に答える