表格行操作(上移、下移)

83 篇文章 0 订阅
52 篇文章 0 订阅

<table width="200" border="1">
    <tbody>
        <tr>
            <td width="25%">1</td>
            <td width="25%">11</td>
            <td width="25%"><a href="javascript:void(0)" οnclick="moveUp(this)">上移</a></td>
            <td width="25%"><a href="javascript:void(0)" οnclick="moveDown(this)">下移</a></td>
        </tr>
        <tr>
            <td>2</td>
            <td>22</td>
            <td><a href="javascript:void(0)" οnclick="moveUp(this)">上移</a></td>
            <td><a href="javascript:void(0)" οnclick="moveDown(this)">下移</a></td>
        </tr>
        <tr>
            <td>3</td>
            <td>33</td>
            <td><a href="javascript:void(0)" οnclick="moveUp(this)">上移</a></td>
            <td><a href="javascript:void(0)" οnclick="moveDown(this)">下移</a></td>
        </tr>
        <tr>
            <td>4</td>
            <td>44</td>
            <td><a href="javascript:void(0)" οnclick="moveUp(this)">上移</a></td>
            <td><a href="javascript:void(0)" οnclick="moveDown(this)">下移</a></td>
        </tr>
        <tr>
            <td>5</td>
            <td>55</td>
            <td><a href="javascript:void(0)" οnclick="moveUp(this)">上移</a></td>
            <td><a href="javascript:void(0)" οnclick="moveDown(this)">下移</a></td>
        </tr>
    </tbody>
</table>

<script type="text/javascript">
<!--
function moveUp(_a){
    var _row = _a.parentNode.parentNode;
    //如果不是第一行,则与上一行交换顺序
    var _node = _row.previousSibling;
    while(_node && _node.nodeType != 1){
        _node = _node.previousSibling;
    }
    if(_node){
        swapNode(_row,_node);
    }
}

function moveDown(_a){
    var _row = _a.parentNode.parentNode;
    //如果不是最后一行,则与下一行交换顺序
    var _node = _row.nextSibling;
    while(_node && _node.nodeType != 1){
        _node = _node.nextSibling;
    }
    if(_node){
        swapNode(_row,_node);
    }
}

function swapNode(node1,node2){
    //获取父结点
    var _parent = node1.parentNode;
    //获取两个结点的相对位置
    var _t1 = node1.nextSibling;
    var _t2 = node2.nextSibling;
    //将node2插入到原来node1的位置
    if(_t1)_parent.insertBefore(node2,_t1);
    else _parent.appendChild(node2);
    //将node1插入到原来node2的位置
    if(_t2)_parent.insertBefore(node1,_t2);
    else _parent.appendChild(node1);
}
//-->
</script>

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值