sortable排序插件的使用

tableList为<table>标签的Id
var resData1 = "";
var res = new Object();
var n = 1;
$('#tableList tbody tr').each(function(i){ // 遍历 tr
var a = $(this).children();//获取每一行
var arr =a[1].innerText;//取得第三列的值（可改变数据下标获取你所需列的值）
res[arr] = n;
n++;
});
resDataFirst = JSON.stringify(res);

//定义fixHelper使得在拖动单元格时不改变单元格的宽度
var fixHelper = function(e, ui) {
ui.children().each(function() {
$(this).width($(this).width()); //在拖动时，拖动行的cell（单元格）宽度会发生改变。在这里做了处理就没问题了
});
return ui;
};
//调用sortable插件，使得单元格可以拖动
$("#tableList tbody").sortable({
placeholder: "ui-state-highlight",
cursor: "move",
helper: fixHelper, //调用fixHelper
axis:"y",
start:function(e, ui){
ui.item.css({"background":"#696969"}); //拖动时的行，要用ui.helper
return ui;
},
stop:function(e, ui){
var res = new Object();
var n = 1;
$('#tableList tbody tr').each(function(i){ // 遍历 tr
var a = $(this).children();//获取每一行
var arr =a[1].innerText;//取得第三列的值
res[arr] = n;
n++;
});
resData1 = JSON.stringify(res);
ui.item.css({"background":"#fff"});
return ui;
}
});
$( "#tableList" ).disableSelection();

//通过ajax保存排序之后的单元格顺序
if (resDataFirst == resData1 || resData1 == ""){
growlAlert.danger('未改变顺序！');
}else{
//提交表单
var url = '';//你自己的保存接口
$.post(url,{order: resData1},
function (data) {
handleResponse(data);
});
}