引入js: http://www.sortablejs.com/index.html
HTML:
<div class="menu-AS" id="AS"> <a href="javascript:;">11</a> <a href="javascript:;">22</a> <a href="javascript:;">33</a> <a href="javascript:;">44</a> <a href="javascript:;">55</a> <a href="javascript:;">66</a> </div>
Js:两种方式都可用。
<script src="js/Sortable.min.js"></script> var sortable = new Sortable(AS, { }); Sortable.create(document.getElementById(‘AS‘), { animation: 150, //动画参数 onAdd: function (evt) { //拖拽时候添加有新的节点的时候发生该事件 console.log(‘onAdd.foo:‘, [evt.item, evt.from]); }, onUpdate: function (evt) { //拖拽更新节点位置发生该事件 console.log(‘onUpdate.foo:‘, [evt.item, evt.from]); }, onRemove: function (evt) { //删除拖拽节点的时候促发该事件 console.log(‘onRemove.foo:‘, [evt.item, evt.from]); }, onStart: function (evt) { //开始拖拽出发该函数 console.log(‘onStart.foo:‘, [evt.item, evt.from]); }, onSort: function (evt) { //发生排序发生该事件 console.log(‘onSort.foo:‘, [evt.item, evt.from]); }, onEnd: function (evt) { //拖拽完毕之后发生该事件 console.log(‘onEnd.foo:‘, [evt.item, evt.from]); } });