使用tableDnD实现表格拖拽排序功能

最新推荐文章于 2024-09-30 17:27:08 发布

MervynLammm

最新推荐文章于 2024-09-30 17:27:08 发布

阅读量807

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/Rec_Mervyn/article/details/103031913

版权

今天做项目需要用到拖拽调整排序的功能。
做个使用tableDnD插件实现的记录。
tableDnD插件Github

放个demo代码。

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Table拖拽测试</title>
	<style>
		.highlight {
    
			background-color: darkgray;
		}
	</style>
	<script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
	<script type="text/javascript" src="jQuery.tablednd.js"></script>
	<script type="text/javascript">
		$(function(){
    
			$("#tableId").tableDnD({
    
				//拖拽时的样式
				onDragClass:'highlight',
				//开始拖拽回调函数
	            onDragStart:function(table,row){
    
	            	console.log('onDragStart');
	            },
	            //拖拽排序完成后回