前端頁面添加表格,實現每一行能上下移動,還可修改數據庫排序字段值


var up = "<a href=\"javascript:void(0)\" onclick=\"moveUp(this)\">上移</a>";
                var down = "<a href=\"javascript:void(0)\" onclick=\"moveDown(this)\">下移</a>";



<tr id="tr_"+i><td>data[i].templateName+templateString+temOrderNum</td>
<td>up+"&nbsp;&nbsp;&nbsp;"+down</td>
</tr>


   /*
    表格整行上下移動
    */
    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 val1=node1.firstChild.lastChild.value;
           var val2=node2.firstChild.lastChild.value;
           node1.firstChild.lastChild.value=val2;
           node2.firstChild.lastChild.value=val1;
        //獲取父結點
        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);
       }

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM