动态Table

原创 2006年05月17日 11:24:00
<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>

table标签 动态 增加行

table标签根据数据多少动态增加行数(挺简单一个事,用的时候真难哇~~~~~~~) 前台如下: Month Savings ...
  • fanxiangru999
  • fanxiangru999
  • 2017年04月22日 16:53
  • 965

Table动态增加删除行

关于table表格行的动态操作。
  • liu1765686161
  • liu1765686161
  • 2015年06月10日 08:58
  • 1230

HTML Table 动态增加 删除 行 code 实例

Dynamic Table
  • oscar999
  • oscar999
  • 2011年01月13日 23:05
  • 9487

动态生成Table

刚会点动态生成Table,其实也不知道是不是叫动态生成Table,但是这个不重要.本来写篇博客介绍点中心思想就好了,但是我偏不,非要作死,想要完整的介绍这个是如何做的.          然后自己建立...
  • liuyanlinglanq
  • liuyanlinglanq
  • 2013年11月29日 20:55
  • 2581

JQUERY方法给TABLE动态增加 删除行

比如设置table的id为tab var trHTML = "..." $("#tab").append(trHTML);//在table最后面添加一行 $("#tab tr:eq(2)").afte...
  • xyr05288
  • xyr05288
  • 2015年06月08日 16:20
  • 4408

js向table中动态插入新行

首先获得表格 用insertRow(0)等来实现插入新行,在新行中插入insertCell(i); 在写内容就可以啦...
  • lin_tuer
  • lin_tuer
  • 2016年12月04日 14:16
  • 718

Javascript 动态合并table单元格

废话不说直接上代码
  • kida_yuan
  • kida_yuan
  • 2016年05月11日 08:48
  • 2490

JS之动态TABLE操作

JS之动态TABLE操作
  • netuser1937
  • netuser1937
  • 2017年02月07日 16:31
  • 316

table表格动态增加行/删除行,动态给highchart赋值

function test_hard_handle_tiaojian_datagrid_searchFun() {     //$('#test_table').datagrid('load', se...
  • an341221
  • an341221
  • 2015年08月07日 08:51
  • 616

bootstarp table 列横向扩展(动态列)

总结一下:首先数据库中查询出要显示的列,拼成表头;然后查询出要显示的数据,并绑定到table中,需要注意的是表头的filed值必须和data中的字段名相等,我这里采用了ArrayList中存储数组,以...
  • princeLuan
  • princeLuan
  • 2017年04月11日 19:25
  • 3543
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:动态Table
举报原因:
原因补充:

(最多只允许输入30个字)