通过jquery-ui中的sortable来实现拖拽排序的简单实例

<script src="{sh::PUB}js/jquery-1.10.1.min.js"></script><link rel="stylesheet" href="Public/css/jquery-ui.min.css"><script src="{sh::PUB}js/jquery-ui.min.js"></script>

<tbody class="sortable">  <tr></tr>  <tr></tr> </tbody>

$(function() {  $(".sortable").sortable({    cursor: "move",    items: "tr", //只是tr可以拖动    opacity: 0.6, //拖动时，透明度为0.6    revert: true, //释放时，增加动画    update: function(event, ui) { //更新排序之后      var categoryids = $(this).sortable("toArray");      var $this = $(this);      $.ajax({        url: '{sh::U("AgentGoods/ajax","todo=categoryDragsort")}',        type: 'POST',        data: 'categoryids=' + categoryids,        success: function(json) {          if (json == 1) {            layer.msg('移动成功', {              icon: 1            });          } else {            $this.sortable("cancel");            layer.msg('移动失败', {              icon: 2            });          }        }      });    }  });  $(".sortable").disableSelection();});

$categoryids  = $this->_post('categoryids');$categoryidsArr = explode(",",$categoryids);foreach ($categoryidsArr as $k => $v) {  $data['sort'] = count($categoryidsArr) - $k;  $data['id']  = $v;  M('Agentgoods_category')->where(array('id'=>$v))->save($data);}exit('1');