js动态添加删除table单元格

最新推荐文章于 2022-07-25 23:30:05 发布

xinew

最新推荐文章于 2022-07-25 23:30:05 发布

阅读量764

点赞数

文章标签： table class input websphere javascript button

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD>
<META http-equiv="Content-Type" content="text/html; charset=GB18030">
<META name="GENERATOR" content="IBM WebSphere Studio">
<TITLE>cfbcard.html</TITLE>
</HEAD>
<SCRIPT language="JavaScript">
var j_1 = 1;
function add_row_family(){
newRow=document.all.family.insertRow(-1)

newcell=newRow.insertCell()
newRow.bgColor='#FFFFFF';
newcell.className='STYLE3';
newcell.align='center';
//newcell.innerHTML="<input type='text' name='familyname"+j_1+"' style='WIDTH: 60px; font-size:9pt; color:#000000' />";
newcell.innerHTML="<SELECT name='thesistogether"+j_1+"'>"+
                        " <option value='请选择'>"+
      "   请选择"+
      " </option>"+
      " <option value='1'>"+
      "   111"+
      " </option>"+
      " <option value='2'>"+
      "   222"+
      " </option>"+
      " <option value='3'>"+
      "   333"+
      " </option>"+
      " <option value='4'>"+
      "   444"+
      " </option>"+
      " <option value='5'>"+
      "   555"+
      " </option>"+

                       "</SELECT>";
for(var i = 0;i<12;i++){
newcell=newRow.insertCell() ;
newRow.bgColor='#FFFFFF';
newcell.className='STYLE3';
newcell.align='center';
newcell.innerHTML="<input type='text' name='familyrelation"+j_1+"' style='WIDTH: 60px; font-size:9pt; color:#000000' />";
}

newcell=newRow.insertCell() ;
newRow.bgColor='#FFFFFF';
newcell.className='STYLE3';
newcell.align='center';
//newcell.innerHTML="<a href='javascript:delTableRow(/""+1+"/")'>删除</a>";
newcell.innerHTML="<input type='button' value='删除' onClick='deleteCurrentRow()'>";
j_1++;
document.all.j_1.value=j_1;
document.all.family.focus();
}

function deleteCurrentRow()//刪除當前行
{
var currRowIndex=event.srcElement.parentNode.parentNode.rowIndex;
document.all.family.deleteRow(currRowIndex);//table10--表格id
}
</script>
<body bgcolor="#F5F1F5" >
<form name="form1" method="post" action="" οnsubmit="">
<table>
<tr>
      <td align="right"><INPUT type="button" name="add" value="添加"></td>
</tr>
<tr>
     <td>
<table id="family" style="width:100%" border="1" cellspacing="1" cellpadding="2" class="tbMain">
        <tr>
   <td class="td_name">111</td>
   <td class="td_name">222</td>
   <td class="td_name">333</td>
   <td class="td_name">444</td>
   <td class="td_name">555</td>
   <td class="td_name">666</td>
   <td class="td_name">777</td>
   <td class="td_name">888</td>
   <td class="td_name">999</td>
   <td class="td_name">000</td>
   <td class="td_name">123</td>
   <td class="td_name">456</td>
   <td class="td_name">789</td>
      <td class="td_name"><input type='button' value='删除' onClick='deleteCurrentRow()'></td>
     </tr>

    </table>
    </td>
</tr>
</table>
</form>
</body>
</html>
本文出自 51CTO.COM技术博客