http://www.evget.com/zh-CN/Info/catalog/7683.html效果如上,但是有个需求,同一行可能存在多列!
(比如第三行,上移,会移动到与第二行同行,再上移,才会移动到第二行上面) * 做一个角色权限高低的排序,有可能不同角色权限一样,(同一行)
类似这样:局长
副局长
主任 副主任
科长 副科长
科员

解决方案 »

  1.   

    <HTML> 
        <HEAD> 
            <TITLE>TestTable</TITLE> 
            <script> 
            var tb ;
               function setOrder(order,cl)
               {
               // debugger;
                    tb = tb||  document.getElementById("tableBody");
                    var arr =[];
                    for(var i=0;i<tb.rows.length;i++){
                    arr.push(tb.rows[i]);
                    }
                    if(order==1) // 升序
                    {
                        arr.sort(function(a,b){return cl==0 ? (a.cells[0].innerHTML > b.cells[0].innerHTML?1:-1) : parseInt( a.cells[1].innerHTML) - parseInt(b.cells[1].innerHTML) ; });
                    }
                    else
                    {
                     arr.sort(function(a,b){return cl==0 ?(a.cells[0].innerHTML < b.cells[0].innerHTML?1:-1)  : parseInt( b.cells[1].innerHTML) - parseInt(a.cells[1].innerHTML);  });
                    
                    }
                   while(tb.hasChildNodes()){
                       tb.removeChild(tb.lastChild);
                    }
                    for (var i = 0; i < arr.length; i++) {     
                        tb.appendChild(arr[i]);  
                        }
                        
                    return false;                    
               }
            </script> 
        </HEAD> 
     
        <BODY> 
         <br />
        
            <table border="1" bordercolor='#000000' align="center" style="border-collapse:collapse;width:500px">
            <thead>
            <tr> 
                        <td width="200px"> 
                           <a href='#' onclick="setOrder(1,0)"> 升序 </a> &nbsp; <a href='#' onclick="setOrder(0,0)"> 降序 </a> 
                        </td> 
                         <td width="200px"> 
                            <a href='#' onclick="setOrder(1,1)"> 升序 </a> &nbsp; <a href='#' onclick="setOrder(0,1)"> 降序 </a>
                        </td> 
                    </tr> 
            </thead> 
                <tbody id="tableBody"> 
                    <tr id="topTr"> 
                        <td width="200px"> 
                           aa
                        </td> 
                         <td width="200px"> 
                            234
                        </td> 
                    </tr> 
                    <tr id="Tr1"> 
                        <td width="200px"> 
                           sddg
                        </td> 
                         <td width="200px"> 
                            235342
                        </td> 
                    </tr> 
                    <tr id="Tr2"> 
                        <td width="200px"> 
                           sadf
                        </td> 
                         <td width="200px"> 
                            6543
                        </td> 
                    </tr> 
                    <tr id="Tr3"> 
                        <td width="200px"> 
                            twer
                        </td> 
                         <td width="200px"> 
                            2343
                        </td> 
                    </tr> 
                </tbody> 
            </table> 
        </BODY> 
    </HTML> 
      

  2.   

    第三行移动到与第二行同行的时候,谁先谁后啊?按职称?你这个,直接放几行TEXT框,在里面填写职称不就完了吗。调整的时候,CTRL+X,CTRLV,也不费劲。
      

  3.   

    http://www.redips.net/javascript/drag-and-drop-table-content/