magazine/assets/manage/html/magazine.html

<style>
.layui-col-md2
{
    height: 250px;
    border:1px solid #bababa;
    margin:5px;
}
.layui-col-md2 .img
{
    text-align: center;overflow: hidden;text-align: center;
}
</style>
<div class="layui-fluid layadmin-cmdlist-fluid">
  <ul class="layui-row layui-col-space30" id="sortable">
    <li class="layui-col-md2 layui-col-sm4" id="data" style="">
        <div class="cmdlist-container">
            <div href="javascript:;" class="img" style="height: 154px;">
              <img src="../../layuiadmin/style/res/template/portrait.png">
            </div>
            <a href="javascript:;" >
              <div class="cmdlist-text" style="text-align:center;">
                <p class="info">2018春夏季新款港味短款白色T恤+网纱中长款chic半身裙套装两件套</p>
                <div class="price">
                    <b></b>
                </div>

                <div class="text"></div>
                

                <div style="margin-top:10px;text-align:center;">
                <div class="layui-table-cell"><a href="javascript:;" class="edit" onclick=""><button type="button" class="btn btn-info btn-rounded waves-effect waves-light m-b-5 layui-btn layui-btn-xs">编辑</button></a>&nbsp;&nbsp;<a href="#" class="oper_delete"><button type="button" class="btn btn-info btn-rounded waves-effect waves-light m-b-5 layui-btn layui-btn-danger layui-btn-xs"><span class="am-icon-trash-o"></span>删除</button></a>&nbsp;&nbsp;</div>
                </div>
              </div>
            </a>
        </div>
    </li>
  </ul>
</div>

<script id="url">var url = ""</script>
<script>
  $( function() {
    var sort = $( "#sortable" ).sortable({
        opacity: 0.7,
        stop:function(){
          var arr = $( "#sortable" ).sortable('toArray');
          arr = arr.join(',');
          $.post(url, {data:arr}, function()
          {

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