js实现上移下移
直接上代码
//上移
var $up = $(".up")
$up.click(function () {
var $tr = $(this).parents("tr");
if ($tr.index() > 1) {
$tr.fadeOut().fadeIn();
$tr.prev().before($tr);
changeSort = 1;
}
});
//下移
var $down = $(".down");
var len = $down.length;
$down.click(function () {
var $tr = $(this).parent().parents("tr");
if ($tr.index() != len) {
$tr.fadeOut().fadeIn();
$tr.next().after($tr);
changeSort = 1;
}
});
然后描述一下具体的需求:
首先在页面上展示了所有的列表数据,用table 的格式展示,然后需要对数据列进行排序,整列上移或者下移。如上,即可实现效果,但是要根据自己的页面情况进行调整
if ($tr.index() > 1) if ($tr.index() != len) 这两个条件
js实现上移下移的更多相关文章
- JS移动li行数据,点击上移下移(是位置的互换,不是top的偏移量改变)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- table中实现数据上移下移效果
html 由于vue+Element项目中的table,没有开放的上移下移的api,但是能对数据操作,故思路为数组中的一条数据,再重新添加一条数据,办法有点笨,但是好歹也是实现了,望有好的办法的,请留 ...
- javaWeb上移下移(SpringMVC+Mabits+MySql)
文章已移至:https://blog.csdn.net/baidu_35468322/article/details/79643356 移动之前: 移动之后: 1.控制层 /** * 修改排序 * * ...
- AngularJS实现数据列表的增加、删除和上移下移等功能实例
转: http://www.jb51.net/article/91991.htm 这篇文章给大家分享了AngularJS循环实现数据列表的增加.删除和上移下移等基础功能,对大家学习AngularJ ...
- php修改排序,上移下移
php修改排序,上移下移 /** $UpDown //移动方向,up或down $table //表名 $id //当前移动的ID $id_col //ID字段的名称 $ ...
- jQuery实现表格行上移下移和置顶
jQuery实现表格行上移下移和置顶 我们在操作列表数据的时候,需要将数据行排列顺序进行调整,如上移和下移行,将行数据置顶等,这些操作都可以在前端通过点击按钮来完成,并且伴随着简单的动态效果,轻松实现 ...
- jqgrid 上移下移单元格
在表格中常常需要调整表格中数据的显示顺序,我用的是jqgrid,实现原理就是将表中的行数保存到数据库中,取数据时按行进行排序 1.上移,下移按钮 <a href="javascript ...
- wpf listbox 选中项 上移下移
原文:wpf listbox 选中项 上移下移 private void MoveUp_Click(object sender, RoutedEventArgs e) { ...
- vue 实现模块上移下移 实现排序
效果图 上移 下移 首先想到的是 数组的相互替换嘛 <template> <div> <div class="box" v-for="(it ...
随机推荐
- Codeforces1295D. Same GCDs (欧拉函数)
https://codeforces.com/contest/1295/problem/D 设gcd(a,m)= n,那么找gcd(a +x ,m)= n个数,其实就等于找gcd((a+x)/n,m/ ...
- 微服务读取不到config配置中心配置信息,Spring Boot无法找到PropertySource:找不到标签Could not locate PropertySource: label not found
服务出现报这个错, o.s.c.c.c.ConfigServicePropertySourceLocator - Could not locate PropertySource: label not ...
- Java实现图形界面的三部曲及IDE中的窗口设计
设计和实现图形用户界面的工作主要有以下几点: • (1)创建组件(Component) • 创建组成界面的各种元素,如按钮.文本框等.• (2)指定布局(Layout) • 根据具体需要排列它们的位置 ...
- PP: Overviewing evolution patterns of egocentric networks by interactive construction of spatial layouts
Problem: get an overall picture of how ego-networks evolve is a common challenging task. Existing te ...
- css样式读取
在做页面改写时,发现外部引入的样式表中一部分的样式起作用,另一部分的样式没有用.无论怎么修改都没有用.最后搜索了下答案,发现是css样式文件与需引入的文件编码不一致.导致样式读取不到或者读取到一半.
- [Luogu]三步必杀
Description Luogu4231 Solution 我最近到底怎么了,这种题都做不出来了,一看题第一反应李超线段树(虽然不会),觉得不可做,看一眼题解才发现这个题可以差分,然后差分还打错了好 ...
- 使用JavaMail发送邮箱详解
package com.gqz.forfuture.email; import java.util.Date; import java.util.Properties; import javax.ma ...
- matplotlib 画封闭图像并填充
1.画矩形 这个费了我半天劲,不知怎么就可以了. 复制来自:https://www.cnblogs.com/ymjyqsx/p/7390288.html import matplotlib.pypl ...
- Windows7自定义主题
一.破解主题限制 Windows系统默认只能允许用户使用系统自带主题(非壁纸),即使用户安装了第三方主题,Windows也会限制很多地方,导致第三方主题用起来怪怪的. 故此,想要一个可以自定义主题的W ...
- ssh: connect to git@gitlab.xxxxx.com:xxxxx.git port 22: Connection refused
公司服务器上的gitlab项目添加了ssh密钥,但是操作时却报错ssh: connect to git@gitlab.xxxxx.com:xxxxx.git port 22: Connection r ...