AI编程助手
AI免费问答

jQuery实现的调整表格行tr上下顺序_jquery

  2016-05-16 15:20   1667浏览 原创

表格是大家比较常用的元素,有时候表格中的行需要调整顺序,下面就通过代码实例介绍一下如何利用jquery实现此功能。

代码实例如下:




<meta charset=" utf-8"><meta name="author" content="http://www.softwhy.com/"><title>本站</title><style type="text/css">
table 
{
background:#F90;
width:400px;
line-height:20px;
}
td 
{
border-right:1px solid gray;
border-bottom:1px solid gray;
}
</style><script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script><script type="text/javascript"> 
function up(obj) 
{ 
var objParentTR=$(obj).parent().parent(); 
var prevTR=objParentTR.prev(); 
if(prevTR.length>0) 
{ 
prevTR.insertAfter(objParentTR); 
} 
} 
function down(obj) 
{ 
var objParentTR=$(obj).parent().parent(); 
var nextTR=objParentTR.next(); 
if(nextTR.length>0) 
{ 
nextTR.insertBefore(objParentTR); 
} 
} 
</script>
本站一 本站一 本站一 上移 下移
本站二 本站二 本站二 上移 下移
本站三 本站三 本站三 上移 下移
本站四 本站四 本站四 上移 下移
本站五 本站五 本站五 上移 下移

通过以上代码简单实现了jQuery实现的调整表格行tr上下顺序,希望本段代码可以帮助到大家。

声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。