如何保存jQuery用戶界面可排序的相互作用的狀態

Question

我有以下代碼：

<script> 
$(function() { 
    $("#sortable").sortable(); 
    $("#sortable").disableSelection(); 
}); 
</script> 


<div class="demo"> 

    <ul id="sortable"> 
    <li class="ui-state-default">Item 1</li> 
    <li class="ui-state-default">Item 2</li> 
    <li class="ui-state-default">Item 3</li> 
    <li class="ui-state-default">Item 4</li> 
    <li class="ui-state-default">Item 5</li> 
    <li class="ui-state-default">Item 6</li> 
    <li class="ui-state-default">Item 7</li> 
    </ul> 

</div> 

當我第一負載頁，該列表是在此（下面第一PIC）爲了（1至7），然後我移動並更改列表的順序（第二張圖片在下面）。點擊重新加載，訂單恢復爲原始訂單。 可以保留列表的變化順序。

感謝你的幫助

Answer 1

這基本上是一個關於如何將數據存儲在頁面刷新之間的問題。這不是特定於jQuery UI的東西。通常有兩種主要的地方，你可以存儲必要的數據：

1）一個cookie
2）數據庫

如果你想保持列表中的長期訂單，那麼你會需要使用數據庫。如果這只是一個短期問題，那麼cookie可能是兩種解決方案中更好的，因爲它更簡單，不需要大量的AJAX請求。

HTML5還提供本地數據存儲，所以你可以用它完成同樣的事情。但它不會被所有瀏覽器支持。