jquery选项卡可排序的订单cookie

Question

我想创建一个记住我的jquery选项卡顺序的cookie。我如何实现这一目标？我看到你也可以创建一个cookie，但我真的不知道从哪里开始。

<script>
    $(function() {
        $( "#tabs" ).tabs().find( ".ui-tabs-nav" ).sortable({ axis: "x" });
    });
    </script>


<div id="tabs">
    <ul>
        <li><a href="#tabs-1">Nunc tincidunt</a></li>
        <li><a href="#tabs-2">Proin dolor</a></li>
        <li><a href="#tabs-3">Aenean lacinia</a></li>
    </ul>

Answer 1

我道歉，这可能不是你想要的标记，但是一个很好的开始！

看看我创造的这个例子：
的 JSFiddle - COOKIES DEMO （任何更改后刷新页面!!）

用于此HTML：

<div id="menu_holder">

    <div class="menu">
        <h2 class="button" id="button1">Menu title 1</h2>
        <ul class="list list1">
            <li>List 1</li>
            <li>List 2</li>
            <li>List 3</li>
        </ul>
    </div>

    <div class="menu">
        <h2 class="button" id="button2">Menu title 2</h2>
        <ul class="list list2">
            <li>List 1</li>
            <li>List 2</li>
            <li>List 3</li>
        </ul>
    </div>

    <div class="menu">
        <h2 class="button" id="button3">Menu title 3</h2>
        <ul class="list list3">
            <li>List 1</li>
            <li>List 2</li>
            <li>List 3</li>
        </ul>
    </div>

</div>

下载这个jQuery COOKIES插件 - ＆gt;的 HERE!

这是我用于演示的jQuery脚本：

$(document).ready(function(){
    $("ul.list").hide();        //Hide all

    $('h2.button').each(function(){                       // For each button
        if  ($.cookie( $(this).attr("id") ) == 'open')    // wich cookie value...
        {                                                 // is equal to the button ID
            $(this).next().show();                        // ...show next element (ul)
            $(this).addClass('opened');                    // and add to this button a class 'opened'
        }
    });

    $("h2.button").click(function(){                    // ON CLICK:

        $(this).toggleClass('opened');                    // toggle class.

        if ( $(this).hasClass('opened') )                
        {
        $.cookie( $(this).attr("id") , 'open' , {expires: 1} );
        }
        else
        {
        $.cookie( $(this).attr("id") , null , {expires: 1} );                
        };

        $(this).next().slideToggle(800);
    });
});

要了解如何处理Cookie，请安装Firebug及其Cookie插件！ 单击按钮并查看响应。

对任何问题发表评论！