实现table中tr、td的可移动效果

先上代码:




    
                    
分类 0 1 2 3
分类一
张三1
李四1
王五1
赵六1
分类二
张三2
李四2
王五2
赵六2
分类三
张三3
李四3
王五3
赵六3
分类四
张三4
李四4
王五4
赵六4


没什么样式,将就着看,知道原理就好

该效果主要是使用jQueryUI这个插件来实现的,那必须的,你需要先下载这个东西

具体的实现看上面js代码


测试过的朋友可能会有这样的疑问:

你这个不行啊,一旦移动td后,tr就移动不了了


我们看会代码,tr的移动和td的移动是两个动作,没完成一个动作,我们需要恢复动作触发前的状态,这样,下个动作的操作就不会受上一个动作的影响

所以答案是,当我们触发一个动作,完成一系列操作后,然后给页面刷新一下,这样,我们触发下一个动作是完全不会被影响的

我们做这个移动效果,说白了就是想换个方式进行排序,这样就行了


你可能感兴趣的:(JS+JQuery)