jQuery实现table表格中行数据上下拖拽功能

最新推荐文章于 2023-09-22 18:20:22 发布

扶风呀

最新推荐文章于 2023-09-22 18:20:22 发布

阅读量1.1k

点赞数

文章标签： javascript jquery js

本文链接：https://blog.youkuaiyun.com/wa_ka_ka/article/details/118600620

版权

该博客详细介绍了如何利用jQuery实现HTML表格中的行数据上下拖拽效果，通过实例代码展示具体实现步骤，帮助开发者增强表格交互体验。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

jQuery实现table表格中行数据上下拖拽功能

$("#table").sortable({
	cursor: "move",
	axis: "y",          //只在y轴进行拖动
	item: "tr",         //拖动的对象
	opacity: 0.5,       //拖动时，透明度为0.5
	revert: false,      //释放时，增加动画
	cancel: "tfoot,thead",  //禁止表头和表末拖拽
	update: function(event,ui){
		
		//拖拽：执行排序操作
		$(this).sortable("toArray");
	}
});