您的位置：首页 > Web前端 > JQuery

jquery.dad.js实现table的垂直拖拽（并取到当前拖拽对象）

2016-12-08 16:26 821 查看
1、首先官网实例，实现的都是div为容器的元素拖拽，示例如下：





2、最近的项目，要实现tbody的每一行tr能够拖拽，并记录拖拽的次数


    

（1）首先：定义html元素（这里就以举个简单的示例）





（2）接着：定义js配置文件

var test=$('.drag-tbody').dad({
target:"tr", //定义要拖拽的DOM对象
})  

*****这里的代码有两点需要注意：

（1）$对象：是需要拖拽的对象父容器，我这里需要tbody下的每一行都能拖拽，所以$对象是tbody的class

（2）target参数：应该插件默认为div,如果不设置为‘tr’,tbody下的tr就没有拖拽效果  ps:也可根据项目需求自定义





(3) 现在，tbody下的每一行都可以垂直拖拽了，那还要打印拖动的第几行，往下看：





*****注意项：

（1）callback()是拖拽成功的回调函数

（2）e 是当前拖拽的对象，用find()找到当前拖拽行的第一列（序号）



内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航