javascript

位置:IT落伍者 >> javascript >> 浏览文章

jQuery对元素进行拖动并重新排序代码


发布日期:2022年11月24日
 
jQuery对元素进行拖动并重新排序代码
本文章来给各位同学介绍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对应原来排列顺序的更新相信大家并不陌生

  

               

上一篇:基于jquery显示隐藏按钮实现代码

下一篇:一个AJAX自动完成功能的js封装源码[支持中文]第1/2页