drag插件使用心得

var $show = $("#loader"); //进度条
var $orderlist = $("#orderlist");
//var $list = $(".module_list");
var list = ['.star_dou'];//包含可拖拽区域
var $list = $(list.toString());//转为Jquery对象
var connect = ['.tag_content'];//可相互拖拽对象,数组形式,可以实现很多地方相互拖拽
var $connect = $(connect.toString());//转为Jquery对象
$connect.sortable({
connectWith: connect,//执行才能实现相互拖拽否则只能拖拽一次
});//必须要执行拖拽方法，才能实现相互拖拽
//拖拽事件
$list.sortable({
opacity: 0.6,
revert: true,
cursor: 'move',
handle: '.m_title',//可触发该事件对象
appendTo: 'body',
connectWith: connect,//可相互拖拽对象
update: function(){
var new_order = [];
var flag_order = [];
$list.children(".modules").each(function() {
new_order.push(this.title);
});
var newid = new_order.join(',');
var oldid = $orderlist.val();

var url = window.location.href;
$('.flag_tag').each(function (){
flag_order.push($(this).attr('data-flag'));
});

alert(flag_order);
$.ajax({
type: "post",
url: "http://cms.eat.sc/index.php?ac=index&method=update_tpl",
data: { id: newid, order: oldid, url: url },   //id:新的排列对应的ID,order：原排列顺序
beforeSend: function() {
$show.html("<img src='load.gif' /> 正在更新");
},
success: function(msg) {
//alert(msg);
$show.html("");
}
});

}
});
});