本文章来给各位同学介绍jQuery对元素进行拖动并重新排序代码
我们像phpwind论坛一样直接在界面无刷新编辑并保存编辑的数据哦
这里都要基本jquery ajax来操作了
下边我们一步一步来实现这个功能
代码如下复制代码
<span id="show">
<div>
<input id="check" type="数据库中数据排序进行更改隐藏域保存原来的图片排列顺序ul显示图片列表
为了能看得过去稍微加了点样式
代码如下复制代码
var show = jQuery("#show"); //输出提示
var orderlist = jQuery("#orderlist"); //原顺序
var check = jQuery("#check");
//是否更新到 }
success: function() {
showhtml("更新成功");
}
});
};
接下来将ajax更新块单独分出来这样程序变得比较整洁这块没有新东西
代码如下复制代码
//调用ajax更新方法
var Submit = function(update) {
var order = [];
listchildren("li")each(function() {
orderpush(thisid);
});
var itemid = orderjoin();
//如果单选框选中则更新表中排列顺序
if (update) {
Update(itemid);
}
else {
showhtml("");
}
};
和得到排列顺序类似将ID组成一个字符串传递给了Update()方法函数中的参数update为checkbox是否选中
代码如下复制代码
//执行排列操作
listsortable({
opacity:
update: function() {
Submit(checkattr("checked"));
}
});
最后执行排列操作后台部分就是对现在ID对应原来排列顺序的更新相信大家并不陌生