针对后台列表table拖拽比较实用的jquery拖动排序
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>jqueryUI拖动</title></head><script src="js/jquery-1.11.0.min.js"></script><script src="js/jquery-ui.min.js"></script><style> tr{cursor: pointer;}</style><body><table id="sort"> <thead> <tr> <th class="index">序号</th> <th>年份</th> <th>标题</th> <th>作者</th> </tr> </thead> <tbody> <tr> <td class="index">1</td> <td>2014</td> <td>这是第1个</td> <td>阿斯蒂芬阿斯蒂芬</td> </tr> <tr> <td class="index">2</td> <td>2015</td> <td>这是第2个</td> <td>阿萨德发射点发岁的</td> </tr> <tr> <td class="index">3</td> <td>2016</td> <td>这是第3个</td> <td>阿萨德发送地方</td> </tr> <tr> <td class="index">4</td> <td>2017</td> <td>这是第4个</td> <td>的说法大赛分</td> </tr> </tbody></table></body></html>$(document).ready(function(){ var fixHelperModified = function(e, tr) { var $originals = tr.children(); var $helper = tr.clone(); $helper.children().each(function(index) { $(this).width($originals.eq(index).width()) }); return $helper; }, updateIndex = function(e, ui) { $('td.index', ui.item.parent()).each(function (i) { $(this).html(i + 1); }); }; $("#sort tbody").sortable({ helper: fixHelperModified, stop: updateIndex }).disableSelection();});针对后台列表table拖拽比较实用的jquery拖动排序的更多相关文章
- jquery拖拽排序,针对后台列表table进行拖拽排序(超实用!)
现在很多后台列表为了方便均使用拖拽排序的功能,对列表进行随意的排序. 话不多说 ,我在网上找了一些demo,经过对比,现在把方便实用的一个demo列出来,基于jqueryUI.js 先上html代码, ...
- ztree插件的使用及列表项拖拽的实现(jQuery)+异步加载节点数据
为了实现如图所示的树状结构图,并使列表项可拖动到盒子里,研究了ztree这个插件的使用,并仔细研究了列表项的拖动事件.完成了预期需求,对jQuery的运用得到了提高.这个插件的功能非常强大,除了基本的 ...
- Qt之股票组件-自选股--列表可以拖拽、右键常用菜单
目录 一.开头嘴一嘴 二.效果展示 三.自选股列表 1.列表初始化 2.添加Item 3.右键菜单 4.拖拽Item 5.刷新数据 四.相关文章 原文链接:Qt之股票组件-自选股--列表可以拖拽.右键 ...
- Android学习系列(11)--App列表之拖拽ListView(下)
接着上篇Android学习系列(10)--App列表之拖拽ListView(上)我们继续实现ListView的拖拽效果. 7.重写onTouchEvent()方法. 在这个方法中我们主要是处理 ...
- Android学习系列(10)--App列表之拖拽ListView(上)
研究了很久的拖拽ListView的实现,受益良多,特此与尔共飨. 鉴于这部分内容网上的资料少而简陋,而具体的实现过程或许对大家才有帮助,为了详尽而不失真,我们一步一步分析,分成两篇文章. ...
- Android学习系列--App列表之拖拽ListView(下)
接着上篇Android学习系列(10)--App列表之拖拽ListView(上)我们继续实现ListView的拖拽效果. 7.重写onTouchEvent()方法. 在这个方法中我们主要是处理 ...
- Android学习系列--App列表之拖拽ListView(上)
研究了很久的拖拽ListView的实现,受益良多,特此与尔共飨. 鉴于这部分内容网上的资料少而简陋,而具体的实现过程或许对大家才有帮助,为了详尽而不失真,我们一步一步分析,分成两篇文章. 一 ...
- 基于html5拖拽api实现列表的拖拽排序
基于html5拖拽api实现列表的拖拽排序 html代码: <ul ondrop="drop_handler(event);" ondragover="dragov ...
- odoo开发笔记-tree列表视图拖拽排序
odoo列表tree视图 拖拽排序 实现效果: 实现方式: 模型中定义字段: class CusYourModel(models.Model): """ 你的模型 &qu ...
随机推荐
- ORACLE 11G在存储过程里面遍历游标, 调用job任务定时运行
ORACLE存储过程里游标遍历.调用job定时运行 1,第一种使用For 循环 for循环是比較简单有用的方法. 首先.它会自己主动open和close游标.攻克了你忘记打开或关闭游标的烦恼. 其次, ...
- C++ 智能指针 shared_ptr
今天晚上去旁听了C++高级编程的课,其中提到智能指针.第一反映还以为是auto_ptr呢,一听才知道是share_ptr这个.哦,原来是C++11特性.大致的原因是auto_ptr有一点缺陷,而sha ...
- Kibana查询说明
elasticsearch构建在Lucene之上,过滤器语法和Lucene相同 Kibana接口概述 Kibana接口分为四个主要部分: 发现 可视化 仪表板 设置 我们将按照列出的顺序浏览每个部分的 ...
- java 多线程10:synchronized锁机制 之 锁定类静态方法 和锁定类.Class 和 数据String的常量池特性
同步静态方法 synchronized还可以应用在静态方法上,如果这么写,则代表的是对当前.java文件对应的Class类加锁.看一下例子,注意一下printC()并不是一个静态方法: public ...
- 纯css3实现的创意图片放大镜
今天要给大家分享的的一款用纯css3实现的图片放大镜特效.页面打开五个小图显示于页面.当鼠标经过图片时,当前图片以灰色背景图的形式展示.效果非常不错. 在线预览 源码下载 实现的代码: html代 ...
- Ubuntu 16.04使用git
Ubuntu 16.04安装git 安装完RabbitVCS之后,Android studio里git还是没法用,找不到git程序,git命令也找不到,说明没有安装git! sudo apt-get ...
- 【Unity/Kinect】显示Kinect摄像头内容,屏幕显示环境背景及人体投影
最近学习用Unity做些体感小游戏,使用Kinect的Unity插件,结合一些官方Demo学习(网上资源用Unity做的较少,蛋疼).插件及其Demo就在Unity商店里搜Kinect即可找到,其中下 ...
- PDNN中数据格式和数据装载选项
吃人家嘴短,拿人家手短,用别人的东西就不要BB了,按规矩来吧. 训练和验证的数据都在命令行以变量的形式按如下方式指定: --train-data "train.pfile,context=5 ...
- java多线程面试题整理及回答
1)现在有T1.T2.T3三个线程,你怎样保证T2在T1执行完后执行,T3在T2执行完后执行? 这个线程问题通常会在第一轮或电话面试阶段被问到,目的是检测你对”join”方法是否熟悉.这个多线程问题比 ...
- iOS彩票项目--第一天,自定义TabBar控制器和自定义TabBar,自定义导航控制器
一.环境配置,和项目层次搭建 二.自定义TabBar 项目中TabBar中的导航按钮美工给的图片太大,图片中包含了图片和文字.最主要的是TabBar上面的按钮图片尺寸是有规定的,当高度大于44的时候, ...