动态控制Table的js代码

答案：<table width="100%" border="1">

  <tr>

    <td width="10%"><table width="100%" height="100%" border="1">

      <tr>

        <td><input type="button" name="Submit3" value="最上" onClick="moveFirst()"></td>

      </tr>

      <tr>

        <td><input type="button" name="Submit" value="向上" onClick="moveUp()"></td>

      </tr>

      <tr>

        <td><input type="button" name="Submit2" value="向下" onClick="moveDown()"></td>

      </tr>

      <tr>

        <td><input type="button" name="Submit4" value="最下" onClick="moveEnd()"></td>

      </tr>

    </table></td>

    <td><table width="100%" border="1" id="DynaTable">

      <tr>

        <td><input type="radio" name="radio1" value="1" onClick="radioChecked(this)"></td>

        <td>第一个</td>

      </tr>

      <tr>

        <td><input type="radio" name="radio1" value="2" onClick="radioChecked(this)"></td>

        <td>第二个</td>

      </tr>

      <tr>

        <td><input type="radio" name="radio1" value="3" onClick="radioChecked(this)"></td>

        <td>第三个</td>

      </tr>

      <tr>

        <td><input type="radio" name="radio1" value="4" onClick="radioChecked(this)"></td>

        <td>第四个</td>

      </tr>

      <tr>

        <td><input type="radio" name="radio1" value="5" onClick="radioChecked(this)"></td>

        <td>第五个</td>

      </tr>

      <tr>

        <td><input type="radio" name="radio1" value="6" onClick="radioChecked(this)"></td>

        <td>第六个</td>

      </tr>

      <tr>

        <td><input type="radio" name="radio1" value="7" onClick="radioChecked(this)"></td>

        <td>第七个</td>

      </tr>

      <tr>

        <td><input type="radio" name="radio1" value="8" onClick="radioChecked(this)"></td>

        <td>第八个</td>

      </tr>

      <tr>

        <td><input type="radio" name="radio1" value="9" onClick="radioChecked(this)"></td>

        <td>第九个</td>

      </tr>

      <tr>

        <td><input type="radio" name="radio1" value="10" onClick="radioChecked(this)"></td>

        <td>第十个</td>

      </tr>

    </table></td>

  </tr>

</table>


<script language="javascript">

<!--

var moveRow=false;

var moveRadio=false;

function radioChecked(obj){

 moveRadio=obj;

 moveRow=obj.parentNode.parentNode;

}

function moveUp(){

 if(moveRow){ 

  var prevRow=moveRow.previousSibling;

  if(prevRow){

  document.all["DynaTable"].childNodes[0].insertBefore(moveRow,prevRow);

  moveRadio.checked=true;

  }

 }

}

function moveDown(){

 if(moveRow){ 

 var nexRow=moveRow.nextSibling;

 if(nexRow){

  var nnextRow=nexRow.nextSibling;  

  if(nnextRow){

   document.all["DynaTable"].childNodes[0].insertBefore(moveRow,nnextRow);

  }else{

   document.all["DynaTable"].childNodes[0].appendChild(moveRow);

  }

  moveRadio.checked=true;

 }

 }

}

function moveEnd(){

 if(moveRow){

  document.all["DynaTable"].childNodes[0].appendChild(moveRow);

  moveRadio.checked=true;

 }

}

function moveFirst(){

 if(moveRow){

  document.all["DynaTable"].childNodes[0].insertBefore(moveRow,document.all["DynaTable"].childNodes[0].firstChild);

  moveRadio.checked=true;

 }

}

//-->

</script>

上一个：网页屏蔽(左右键,代码等)的非JS方法第1/2页
下一个：一个高效的JavaScript压缩工具下载集合