最近在负责做网站的后台管理部分，觉得jquery的sortable做动态工具栏很实用,但网上很多都只介绍ajax和sortable一起，没有和database结合着用，唯一看到的就是用cookie，如果有朋友喜欢用cookie的，可以来这里看看。 我个人不喜欢cookie，cookie有时间的限制，而且好多人现在都禁止cookie的使用了。就自己编了个码，用php、javascript来实现数据库功能。点击这里察看实例。点击这里下载代码
首先安装jquery代码和css部分：
<script src="jquery.js" type="text/javascript"></script>
<script type="text/javascript" src="ui.core.js"></script>
<script type="text/javascript" src="ui.sortable.js"></script>
<style type="text/css">
body, form, ul, dl, dt,h3,hr,div, img, p, a{margin: 0;padding: 0;font: 12px Geneva, Arial, Helvetica, sans-serif;}
.box { width:360px; height:auto;}
.widget { height:30px; width:360px; background-color:#DBDBDB; border:1px solid #CCCCCC; margin-top:6px;}
.drag_title { width:300px; height:30px; float:left; font-weight:bold; font-size:15px; line-height:30px;color:#000000; }
.drag { height:30px; width:30px;float:left;cursor:move;background-image:url(drag.jpg);}
.more { float:right; width:30px; height:30px; cursor:pointer; background-image:url(more.jpg);}
.less { float:right; width:30px; height:30px; cursor:pointer;background-image:url(less.jpg)}
.slide { width:360px; height:auto; border:1px solid #DBDBDB; border-top: none;}
.content { width:340px; height:auto; margin:auto;}
.clear { clear:both;}
</style>
html部分，这里说明下原理：有2个显示内容的div，demo和sample，demo为空，先把内容load到sample里，然后根据数据库回馈的排列顺序把sample里的内容一个接一个的添加进demo里，过程中sample一直是隐藏状态。注意sample下的每个box都有自己的id，程序会用id来查找相应的内容。
<div class="demo" id="demo">
<!-- 这里是空的 -->
</div>
<div class="sample" id="sample">
<div class="box" id="sample1">
<div class="widget"><div class="drag"></div><div class="drag_title">第一层</div&
