jquery選項卡可排序的命令cookie

Question

我想創建一個cookie來記住我的jquery選項卡的順序。我如何實現這一目標？我看到你可以創建一個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 - - >HERE!

這裏是jQuer Ÿ腳本我用來演示：

$(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); 
    }); 
}); 

要查看餅乾被如何處理，安裝Firebug的和他的Cookie插件！
單擊按鈕並查看響應。

發表評論任何問題！