求一事件(点上移按钮，选中的行会上移一行，否则下移)

<table border=1 width=400>
  <tr>
    <td>姓名</td>
    <td>数学</td>
    <td>历史</td>
    <td>外语</td>
    <td>总分</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>张三</td>
    <td>78</td>
    <td>82</td>
    <td>85</td>
    <td>245</td>
    <td><input type=button value="上移" onclick="mm(this, -1)">
    <input type=button value="下移" onclick="mm(this, 1)"></td>
  </tr>
  <tr>
    <td>王二</td>
    <td>78</td>
    <td>92</td>
    <td>95</td>
    <td>265</td>
    <td><input type=button value="上移" onclick="mm(this, -1)">
    <input type=button value="下移" onclick="mm(this, 1)"></td>
  </tr>
  <tr>
    <td>李四</td>
    <td>78</td>
    <td>92</td>
    <td>85</td>
    <td>255</td>
    <td><input type=button value="上移" onclick="mm(this, -1)">
    <input type=button value="下移" onclick="mm(this, 1)"></td>
  </tr>
</table>
<SCRIPT LANGUAGE="JavaScript">
<!--
function searchObjByTagName(obj, tag)
{
  while(obj!=null && typeof(obj.tagName) != "undefind")
  {
    if(obj.tagName == tag.toUpperCase()) return(obj);
    obj = obj.parentElement;
  }
  return null;
}
function mm(e, n)
{
  var tab = searchObjByTagName(e, "TABLE");
  var tr  = searchObjByTagName(e, "TR");
  var i = tr.rowIndex;
  var m = i+n>tab.rows.length-1? tab.rows.length-1 : i+n;
  if(m==-1) m=0;
  tab.moveRow(i, m);
}
//-->
</SCRIPT>

解决方案 »

  1.   

    function mm(obj)
    {
      mm1();
    obj.bgColor = '#66CC00'; 
      globalTR = obj;
    strDM = obj.id;//获得选中行的ID
    }
    var globalTR;
    function toUpMove()
    {
      if(globalTR)
      {
        var tab = globalTR.parentElement.parentElement;
        var i = globalTR.rowIndex - 1;
        if(i==0) i=1;
        tab.moveRow(globalTR.rowIndex, i);
      }
    }
    function toDownMove()
    {
      if(globalTR)
      {
        var tab = globalTR.parentElement.parentElement;
        var i = globalTR.rowIndex + 1;
        if(i>=tab.rows.length) i= tab.rows.length - 1;
        tab.moveRow(globalTR.rowIndex, i);
      }
    }
      

  2.   

    全部代码:
    <html>
    <head>
    <meta http-equiv="Content-Language" content="zh-cn">
    <meta name="GENERATOR" content="Microsoft FrontPage 5.0">
    <meta name="ProgId" content="FrontPage.Editor.Document">
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <title></title>
    </head><body bgcolor="#FFFFFE" leftMargin=0 topMargin=0 onLoad="mm1()">
    <form method="post" name="reg" >
    <table align="center" border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#666666" width="100%" id="AutoNumber1">
      <tr>
    <td width="100%" bgcolor="#FFFFFF">
          <table align="center" width="96%" id=tableList border="0" cellpadding="1" cellspacing="1" class="tableList">      
       <tr align="center" class="tableListHeader" height="25">
    <td class="sort">序号</td>
    <td class="sort">审核流程名称</td>
          </tr>
      
          <tr align="center" class="tableListContent" id="21" onClick="mm(this)">
       <td>1</td>
       <td>审核1</td>
      </tr>
      
          <tr align="center" class="tableListContent" id="22" onClick="mm(this)">
       <td>2</td>
       <td>审核2</td>
      </tr>
      
          <tr align="center" class="tableListContent" id="23" onClick="mm(this)">
       <td>3</td>
       <td>审核3</td>
      </tr>
      
          <tr align="center" class="tableListContent" id="24" onClick="mm(this)">
       <td>4</td>
       <td>审核4</td>
      </tr>
       
        </table>

    <table width="96%" border="0" align="center" cellpadding="3" cellspacing="0" class="midTable1td4">
      <tr class="tableListContent" align="center">
        <td bgcolor="#FFFFFF">
      <input type="button" name="upMove" class="button" value="上 移" onClick="toUpMove()">
      <input type="button" name="downMove" class="button" value="下 移" onClick="toDownMove()">
    </td>
      </tr>
    </table>    
       </td>
      </tr>
      
    </table>
    </form>
    </body>
    </html>
    <script language="javascript">
    var strDM;//定义要传递的主键和值
    function selected(trid){
      trid.parentElement.parentElement.bgColor=trid.checked?'#c3d6e6':''
    }
    function CheckAll(form)  
    {
      for (var i=0;i<form.elements.length;i++)    {
        var e = form.elements[i];
        if (e.name != 'chkall')  e.checked = form.chkall.checked; 
       }
    }
    function mm(obj)
    {
      mm1();
    obj.bgColor = '#66CC00'; 
      globalTR = obj;
    strDM = obj.id;//获得选中行的ID
    }
    var globalTR;
    function toUpMove()
    {
      if(globalTR)
      {
        var tab = globalTR.parentElement.parentElement;
        var i = globalTR.rowIndex - 1;
        if(i==0) i=1;
        tab.moveRow(globalTR.rowIndex, i);
      }
    }
    function toDownMove()
    {
      if(globalTR)
      {
        var tab = globalTR.parentElement.parentElement;
        var i = globalTR.rowIndex + 1;
        if(i>=tab.rows.length) i= tab.rows.length - 1;
        tab.moveRow(globalTR.rowIndex, i);
      }
    }
    function mm1()
    {
        coll = document.getElementsByTagName("TR");
        for(var i = 0; i < coll.length; i++){ 
      if(i%2){
         coll[i].bgColor = '#EBEBEB' ;
       }else{
         coll[i].bgColor = '#c3d6e6' ;
       }
    }
    }</script>
      

  3.   

    <!--
    All Files Design & Write by Windy_sk, you can use it freely but ...
    YOU MUST KEEP THIS ITEM !
    Email: [email protected]
    -->
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <title>Power Table</title>
    <style>
    body{
    FONT-SIZE: 9pt; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; PADDING-TOP: 0px;
    }
    input {
    FONT-SIZE: 9pt; height: 15pt; width:50px; cursor: default;
    }
    table{
    font-size: 9pt;
    word-break:break-all;
    cursor: default;
    BORDER: black 1px solid;
    background-color:#eeeecc;
    border-collapse:collapse;
    border-Color:#999999;
    align:center;
    }
    </style>
    <script language="JavaScript1.2">
    /*
     This following code are designed and writen by Windy_sk <[email protected]>
     You can use it freely, but u must held all the copyright items!
    */var Main_Tab = null;
    var cur_row = null;
    var cur_col = null;
    var cur_cell = null;
    var Org_con = "";
    var sort_col = null;var show_col = false;
    var charMode = true;
    var act_bgc = "#BEC5DE";
    var act_fc = "black";
    var cur_bgc = "#ccffcc";
    var cur_fc = "black";function init(){
    cur_row = null;
    cur_col = null;
    cur_cell = null;
    sort_col = null;
    Main_Tab  = PowerTable;
    read_def(Main_Tab)
    Main_Tab.onmouseover = overIt;
    Main_Tab.onmouseout = outIt;
    Main_Tab.onclick = clickIt;
    Main_Tab.ondblclick = dblclickIt;
    Org_con = Main_Tab.outerHTML;

    arrowUp = document.createElement("SPAN");
    arrowUp.innerHTML = "5";
    arrowUp.style.cssText  = "PADDING-RIGHT: 0px; MARGIN-TOP: -3px; PADDING-LEFT: 0px; FONT-SIZE: 10px; MARGIN-BOTTOM: 2px; PADDING-BOTTOM: 2px; OVERFLOW: hidden; WIDTH: 10px; COLOR: blue; PADDING-TOP: 0px; FONT-FAMILY: webdings; HEIGHT: 11px"; arrowDown = document.createElement("SPAN");
    arrowDown.innerHTML = "6";
    arrowDown.style.cssText = "PADDING-RIGHT: 0px; MARGIN-TOP: -3px; PADDING-LEFT: 0px; FONT-SIZE: 10px; MARGIN-BOTTOM: 2px; PADDING-BOTTOM: 2px; OVERFLOW: hidden; WIDTH: 10px; COLOR: blue; PADDING-TOP: 0px; FONT-FAMILY: webdings; HEIGHT: 11px";
    }function window.onload(){
    init();

    drag = document.createElement("DIV");
    drag.innerHTML = "";
    drag.style.textAlign  = "center";
    drag.style.position  = "absolute";
    drag.style.cursor  = "hand";
    drag.style.border  = "1 solid black";
    drag.style.display  = "none";
    drag.style.zIndex  = "999";

    document.body.insertBefore(drag);
    setInterval("judge_move()",100);
    setInterval("showContent.value=Main_Tab.innerHTML;monitor.value='cur_row: '+cur_row+'; cur_col: '+cur_col + '; sort_col: ' +sort_col",1000);
    }function judge_move(){
    move[0].disabled=(cur_row == null || cur_row<=1);
    move[1].disabled=(cur_row == null || cur_row==Main_Tab.rows.length-1 || cur_row == 0);
    move[2].disabled=(cur_col == null || cur_col==0);
    move[3].disabled=(cur_col == null || cur_col==Main_Tab.rows[0].cells.length-1);
    }document.onselectstart = function(){return false;}document.onmouseup = drag_end;function clear_color(){
    the_table=Main_Tab;
    if(cur_col!=null){
    for(i=0;i<the_table.rows.length;i++){
    with(the_table.rows[i].cells[cur_col]){
    style.backgroundColor=oBgc;
    style.color=oFc;
    }
    }
    }
    if(cur_row!=null){
    for(i=0;i<the_table.rows[cur_row].cells.length;i++){
    with(the_table.rows[cur_row].cells[i]){
    style.backgroundColor=oBgc;
    style.color=oFc;
    }
    }
    }
    if(cur_cell!=null){
    cur_cell.children[0].contentEditable = false;
    with(cur_cell.children[0].runtimeStyle){
    borderLeft=borderTop="";
    borderRight=borderBottom="";
    backgroundColor="";
    paddingLeft="";
    textAlign="";
    }
    }
    }function document.onclick(){
    window.status = "";
    clear_color();
    cur_row  = null;
    cur_col  = null;
    cur_cell = null;
    }function read_def(the_table){
    for(var i=0;i<the_table.rows.length;i++){
    for(var j=0;j<the_table.rows[i].cells.length;j++){
    with(the_table.rows[i]){
    cells[j].oBgc = cells[j].currentStyle.backgroundColor;
    cells[j].oFc  = cells[j].currentStyle.color;
    if(i==0){
    cells[j].onmousedown = drag_start;
    cells[j].onmouseup = drag_end;
    }
    }
    }
    }
    }function get_Element(the_ele,the_tag){
    the_tag = the_tag.toLowerCase();
    if(the_ele.tagName.toLowerCase()==the_tag)return the_ele;
    while(the_ele=the_ele.offsetParent){
    if(the_ele.tagName.toLowerCase()==the_tag)return the_ele;
    }
    return(null);
    }var dragStart = false;
    var dragColStart = null;
    var dragColEnd = null;function drag_start(){
    var the_td = get_Element(event.srcElement,"td");
    if(the_td==null) return;
    dragStart = true;
    dragColStart = the_td.cellIndex;
    drag.style.width = the_td.offsetWidth;
    drag.style.height = the_td.offsetHeight;
    function document.onmousemove(){
    drag.style.display = "";
    drag.style.top = event.y - drag.offsetHeight/2;
    drag.style.left = event.x - drag.offsetWidth/2;
    for(var i=0;i<Main_Tab.rows[0].cells.length;i++){
    with(Main_Tab.rows[0].cells[i]){
    if((event.y>offsetTop+parseInt(document.body.currentStyle.marginTop) && event.y<offsetTop+offsetHeight+parseInt(document.body.currentStyle.marginTop)) && (event.x>offsetLeft+parseInt(document.body.currentStyle.marginLeft) && event.x<offsetLeft+offsetWidth+parseInt(document.body.currentStyle.marginLeft))){
    runtimeStyle.backgroundColor=act_bgc;
    dragColEnd=cellIndex;
    }else{
    runtimeStyle.backgroundColor="";
    }
    }
    }
    if(!(event.y>Main_Tab.rows[0].offsetTop+parseInt(document.body.currentStyle.marginTop) && event.y<Main_Tab.rows[0].offsetTop+Main_Tab.rows[0].offsetHeight+parseInt(document.body.currentStyle.marginTop))) dragColEnd=null;
    }
    drag.innerHTML = the_td.innerHTML;
    drag.style.backgroundColor = the_td.oBgc;
    drag.style.color = the_td.oFc;
    }function drag_end(){
    dragStart = false;
    drag.style.display="none";
    drag.innerHTML = "";
    drag.style.width = 0;
    drag.style.height = 0;
    for(var i=0;i<Main_Tab.rows[0].cells.length;i++){
    Main_Tab.rows[0].cells[i].runtimeStyle.backgroundColor="";
    }
    if(dragColStart!=null && dragColEnd!=null && dragColStart!=dragColEnd){
    change_col(Main_Tab,dragColStart,dragColEnd);
    if(dragColStart==sort_col)sort_col=dragColEnd;
    else if(dragColEnd==sort_col)sort_col=dragColStart;
    document.onclick();
    }
    dragColStart = null;
    dragColEnd = null;
    document.onmousemove=null;
    }
      

  4.   

    meizz(梅花雪)大哥，太感谢你了！