JQuery实现table中tr上移下移的示例(超简单)
时间:2019-04-12
本文章向大家介绍JQuery实现table中tr上移下移的示例(超简单),主要包括JQuery实现table中tr上移下移的示例(超简单)使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
表格样式
<table> <tr> <td><input type="button" value="上移" onclick="moveUp(this)"/></td> <td><input type="button" value="下移" onclick="moveDown(this)"/></td> </tr> <tr> <td><input type="button" value="上移" onclick="moveUp(this)"/></td> <td><input type="button" value="下移" onclick="moveDown(this)"/></td> </tr> <tr> <td><input type="button" value="上移" onclick="moveUp(this)"/></td> <td><input type="button" value="下移" onclick="moveDown(this)"/></td> </tr> </table>
js代码
// 上移 function moveUp(obj) { var current = $(obj).parent().parent(); //获取当前<tr> var prev = current.prev(); //获取当前<tr>前一个元素 if (current.index() > 0) { current.insertBefore(prev); //插入到当前<tr>前一个元素前 } } // 下移 function moveDown(obj) { var current = $(obj).parent().parent(); //获取当前<tr> var next = current.next(); //获取当前<tr>后面一个元素 if (next) { current.insertAfter(next); //插入到当前<tr>后面一个元素后面 } }
以上这篇JQuery实现table中tr上移下移的示例(超简单)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- python操作列表的函数使用代码详解
- JS实现延迟隐藏功能的方法(类似QQ头像鼠标放上展示信息)
- JavaScript判断变量名是否存在数组中的实例
- 基于substring()和substr()的使用以及区别(实例讲解)
- apache commons工具集代码详解
- bootstrap-table.js扩展分页工具栏(增加跳转到xx页)功能
- jvm类加载器基础解析
- JS实现简单的浮动碰撞效果示例
- java文件的重命名与移动操作实例代码
- java编程之xpath介绍
- Python matplotlib画图实例之绘制拥有彩条的图表
- JS控制鼠标拒绝点击某一按钮的实例
- JS计算距当前时间的时间差实例
- 详解Spring MVC如何测试Controller(使用springmvc mock测试)
- java显示目录文件列表和删除目录功能