动态增加表单域-优快云博客

博客介绍了使用JS动态增加表单对象的方法。原本非JS方法不理想，作者在编写中曾将添加行按钮属性写成submit而浪费时间。文中给出了完整的HTML代码和JS函数，包括增加、删除明细及提交表单等功能函数。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

最近有个地方需要用到动态增加表单对象，原本不是采用js的方法比较不理想，以下是js的方法。

在编写过程中不小心把添加行按纽的属性写成了submit，浪费了许多时间，才发现。

<%@ page contentType="text/html; charset=gb2312" language="java" %>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<link rel="stylesheet" type="text/css" href="../css/table.css">
<title></title>

</tbody>

</table>
</div>
</form>

<table id="tbDetailPrepare" style="display:none">
<tr>
<td><input name="FNo" type="text" id="FNo" size="15"></td>
<td><input name="sCity" type="text" id="sCity" size="10"></td>
</tr>
</table>

</html>

window.onload = historyOncemore;
window.onbeforeunload = fixHistory;

function fixHistory() //记住历史
{
document.all("theHistoryRecord").value=document.all("thedetailtableDIV").innerHTML.replace(//n/g,"");
}

function historyOncemore()      //恢复历史
{
  if (document.all("theHistoryRecord").value!="")
   {document.all("thedetailtableDIV").innerHTML=document.all("theHistoryRecord").value;
   }
}

}

function delDetailProcess()      //删除明细
{
  var alltbDetailUsed= document.all("tbDetailUsed").rows;
  if (confirm("确定选择正确并且要将这些明细删除")==false) return false;
  for(var i=0;i<alltbDetailUsed.length-1;i++)
  {
   if (alltbDetailUsed[i].all("record_select").checked==true)
   {
    document.all("tbDetailUsed").deleteRow(i);
    i=i-1;
   }
  }
}

function submitProcess()
{
document.frm.submit();
}

</script>