如何设置动态表格里一个文本框的Name,Id等属性

给个例子你看看
<html>
<head>
<title>DHtml举例14</title>
<style><!--
body {font-family:"宋体";color="blue";font-size:"9pt"}
-->
</style>
<script language="JavaScript">
function Insert()
{
document.all.New.insertAdjacentHTML("AfterBegin","<input type='text' name='aa'>");
//第一个参数是用来指明位置，第二个参数是要插入的Html内容。
}//function
</script>
</head>
<body>
<p> <br>
</p>
<p id="New" onclick="Insert()">点击此行蓝色文字将插入文本</p>  <script language="JavaScript">
  var i=0;
function document.onkeydown()
{if(window.event.keyCode=="13")
aa();
}
function aa()
{
table = document.all.mytable;//document.getElementById(tableID);
myNewRow =table.insertRow(table.rows.length);
i=i+1;
myNewCell = myNewRow.insertCell(0);
myNewCell.innerHTML = "<input type='text' name=aa"+i+" value=aa"+i+">";
i=i+1;
myNewCell = myNewRow.insertCell(1);
myNewCell.innerHTML = "<input type='text' name=aa"+i+">";
i=i+1;
myNewCell = myNewRow.insertCell(2);
myNewCell.innerHTML = "<input type='text' name=aa"+i+">"; 
document.form1.textfield1.value=i;
}
function aainsert()
{
table = document.all.mytable;//document.getElementById(tableID);
myNewRow =table.insertRow(table.rows.length);
i=i+1;
myNewCell = myNewRow.insertCell(0);
myNewCell.innerHTML = "<input type='text' name=aa"+i+" value=aa"+i+">";
i=i+1;
myNewCell = myNewRow.insertCell(1);
myNewCell.innerHTML = "<input type='text' name=aa"+i+">";
i=i+1;
myNewCell = myNewRow.insertCell(2);
myNewCell.innerHTML = "<input type='text' name=aa"+i+">"; 
document.form1.textfield1.value=i;
}
</script>
<form name="form1" method="get" action="popwin.htm">
  <table id="mytable" width="364" border="1" cellspacing="0" cellpadding="0">
    <tr> 
      <td width="200"> 
        <input type="text" name="textfield1">
      </td>
      <td width="80">
        <input type="text" name="textfield2">
      </td>
      <td width="76">
        <input type="text" name="textfield3">
      </td>
    </tr>
  </table>
  <p>
    <input type="submit" name="Submit" value="Submit" onclick="return check()">
  </p>
</form>
<p> 
  <input type="button" name="Button" value="增加一行" onclick="aa()">
  按&lt;-按钮增加一行,按回车键也增加一行</p>
<p><input type=button value="next" onclick="window.location='a.html?id=123&pid=234'"></p>
<p>&nbsp; </p>
<script language="JavaScript">
function check()
{for(i=0;i<document.form1.elements.length-1;i++)
      if(document.form1.elements(i).value=="")
  {alert("你没有填完,不能提交!\n注意你新增加的行必须填");
  return false;}
}</script>
</body>
</html>

解决方案 »

  1.   

    theTable.rows[i].cells[j].firstChild.setAttribute("id","id1");
    theTable.rows[i].cells[j].firstChild.setAttribute("name","name1");或theTable.rows[i].cells[j].firstChild.id="id1"
    theTable.rows[i].cells[j].firstChild.name="name1"
      

  2.   


    <form>
     <table width="693" border="1" align="center" cellpadding="0" cellspacing="0"  id="ActTable">
       
    <thead>
           <tr>
    <th>是否有效</th>
    <th>节目名称</th>
    <th>主持人</th>
    <th>开始时间</th>
    <th>结束时间</th>
    <th>排列顺序</th>
          </tr>
    </thead>
       
    <tbody>
          <tr> 
    <td width="79">
               <input name="isValid" type="checkbox" id="isValid_1" value="checkbox">
             </td>        <td width="139">
                     <select name="ActTypeId" id="ActTypeId">
    <option selected>--请选择--</option>   
    </select>
             </td>
    <td width="113">
                   <select name="ActDjId" size="1" id="ActDjId">
              <option selected>--选择--</option>
          </select> 
              </td>
    <td width="74">
                <input name="ActStartTime" type="text" id="ActStartTime" size="7" maxlength="5">
               </td>
    <td width="79"><input name="ActEndTime" type="text" id="ActEndTime" size="7" maxlength="5">
             </td>
             <td width="106"><input name="ActPrintOrder" type="text" id="ActPrintOrder" size="4" maxlength="2">
             </td>
          </tr>
    </tbody>
    </table>
    </form>
    <div align=right>
    <input type="button" name="Button3" value="添加节目" onclick="javascript:ActAdd(this.form)">
    <input type="button" name="Button3" value="显示ID和NAME" onclick="javascript:show(this.form)"></div>
    <script>
    var i = 0
    function ActAdd(theform){
    var theTable = document.getElementById("ActTable");
    var theTBody = theTable.children[1].cloneNode(true);
    //////////////////////////////////////////////////////////////////
    //设置NAME，IDfor(var i=0;i<theTBody.firstChild.childNodes.length;i++){
    theTBody.firstChild.childNodes[i].firstChild.id="id" + i +"_" + theTable.rows.length
    theTBody.firstChild.childNodes[i].firstChild.name="name" + i +"_" + theTable.rows.length
    }theTable.insertAdjacentElement("beforeEnd",theTBody);//插入结点
    }
    function show(theform){
    for(var i=0;i<document.forms[0].elements.length;i++)
    alert("id=" + document.forms[0].elements[i].id + ",name=" +document.forms[0].elements[i].name)
    }
    </script>
      

  3.   

    非常感谢两位~~特别是第二钟办法最简单
    用cloneNode方法复制一行
    然后设置id
    一切OK！！
    接份