fdsa34345235 2011-09-07 00:30
浏览 706
已采纳

js怎样才能动态修改表格中的内容

我想做一个功能,就是给表格动态添加行,下面是我的代码,但是目前只能实现添加和删除,不能修改,我想实现修改这个功能,哪位高手能帮我一下?下面这是全部的代码:



www.yuanshi88.com body{font-family:Verdana, Geneva, sans-serif; font-size:12px; margin:0px; padding:0px;} table{font-size:12px; font-family:Verdana, Geneva, sans-serif} td{text-align:center; background:#FFF} tr{height:20px;} th{background:#9DACBF; color:#FFF; height:20px; line-height:20px} a{color:#99C;} a:hover{color:#F93} .input td{padding:2px} .input input{width:100%; border:1px solid #000; overflow:hidden} .btn{} //简化document.getElementById()方法 function getObj(obj){ return document.getElementById(obj); } function insRow(){ //插入行 var obj=getObj("nw"); var newRow=obj.insertRow(obj.rows.length); //插入行方法 var newCell1=newRow.insertCell(newRow.cells.length); //插入单元格 如果直接用insertCell()在FF里会出错,所以为了兼容,我们要加上newRow.cells.length参数 var newCell2=newRow.insertCell(newRow.cells.length); var newCell3=newRow.insertCell(newRow.cells.length); newCell1.innerHTML=getObj("name").value; //插入单元格后,现在向单元格中添加内容 newCell2.innerHTML=getObj("add").value; //清空文本框 document.all("name").value=""; document.all("add").value=""; //将当前表格最后一行的序号写在delRow()方法中,这样我们可以在delRow()方法中删除当前行 newCell3.innerHTML='<a href="javascript:delRow('+(obj.rows.length-1)+')">删除</a>'; } //删除行 function delRow(i){ var obj=getObj("nw"); obj.deleteRow(i); }

Javascript控制表格 实现动态添加和删除表格内容

编号 名称 操作


  • 写回答

1条回答 默认 最新

  • _1_1_7_ 2011-09-07 10:29
    关注

    我也学习了一把

    [code="html"]



    www.yuanshi88.com body { font-family: Verdana, Geneva, sans-serif; font-size: 12px; margin: 0px; padding: 0px; } table { font-size: 12px; font-family: Verdana, Geneva, sans-serif } td { text-align: center; background: #FFF } tr { height: 20px; } th { background: #9DACBF; color: #FFF; height: 20px; line-height: 20px } a { color: #99C; } a:hover { color: #F93 } .input td { padding: 2px } .input input { width: 100%; border: 1px solid #000; overflow: hidden } .btn { } //简化document.getElementById()方法 function getObj(obj){ return document.getElementById(obj); } function insRow(){ //插入行 var obj=getObj("nw"); var newRow=obj.insertRow(obj.rows.length); //插入行方法 var newCell1=newRow.insertCell(newRow.cells.length); //插入单元格 如果直接用insertCell()在FF里会出错,所以为了兼容,我们要加上newRow.cells.length参数 var newCell2=newRow.insertCell(newRow.cells.length); var newCell3=newRow.insertCell(newRow.cells.length); newCell1.innerHTML=getObj("name").value; //插入单元格后,现在向单元格中添加内容 newCell2.innerHTML=getObj("add").value; //清空文本框 document.all("name").value=""; document.all("add").value=""; //将当前表格最后一行的序号写在delRow()方法中,这样我们可以在delRow()方法中删除当前行 newCell3.innerHTML='<a href="javascript:delRow('+(obj.rows.length-1)+')">删除</a>|<a href="javascript:editRow('+(obj.rows.length-1)+')">修改</a>'; } //删除行 function delRow(i){ var obj=getObj("nw"); obj.deleteRow(i); } //修改行 function editRow(i){ var tab=getObj("nw"); getObj("name").value=tab.rows(i).cells(0).innerText; getObj("add").value=tab.rows(i).cells(1).innerText; document.getElementById("Insert").style.display="none"; document.getElementById("Save").style.display="block"; document.getElementById("CurrentRow").value=i; } function saveRow(){ var i=document.getElementById("CurrentRow").value-0; var tab=getObj("nw"); tab.rows(i).cells(0).innerText= getObj("name").value; tab.rows(i).cells(1).innerText=getObj("add").value; getObj("name").value=""; getObj("add").value=""; document.getElementById("Insert").style.display="block"; document.getElementById("Save").style.display="none"; }

    Javascript控制表格 实现动态添加和删除表格内容


    编号 名称 操作


    [/code]

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

悬赏问题

  • ¥15 求差集那个函数有问题,有无佬可以解决
  • ¥15 【提问】基于Invest的水源涵养
  • ¥20 微信网友居然可以通过vx号找到我绑的手机号
  • ¥15 寻一个支付宝扫码远程授权登录的软件助手app
  • ¥15 解riccati方程组
  • ¥15 display:none;样式在嵌套结构中的已设置了display样式的元素上不起作用?
  • ¥15 使用rabbitMQ 消息队列作为url源进行多线程爬取时,总有几个url没有处理的问题。
  • ¥15 Ubuntu在安装序列比对软件STAR时出现报错如何解决
  • ¥50 树莓派安卓APK系统签名
  • ¥65 汇编语言除法溢出问题