HTML+Javascript复制表格行并清空form表单input/select值.

原創

bruni

2020-02-22 13:34

需求是这样的:

数据库端是一对多(主表和从表), 要求页面上用一个表单输入完成. 还要能够动态增加输入行.

页面上, 需要解决的主要是下面两个问题:

- 动态复制行, 追加到表格末尾
- 对复制的行清空原有的输入

下面是一个测试页面:

<body> <form name="abc" action=""> <table width="200" border="1" id="table1"> <tr> <td><input type="text" name="txt_a" id="textfield" value="aaa"/></td> <td><input type="text" name="txt_b" id="textfield2" value="bbb" /></td> <td><input type="text" name="txt_c" id="textfield3" value="ccc" οnclick="m_TestParentNode(this);"/></td> <td><select name="sel_a"><option value="a">aaa</option><option value="b">bbb</option></select></td> </tr> </table> <table width="200" border="1" id="myTable"> <tr id="row_0"> <td><input type="text" name="txt_a" id="textfield" /></td> <td><input type="text" name="txt_b" id="textfield2" /></td> <td><input type="text" name="txt_c" id="textfield3" /></td> <td><select name="sel_a"><option value="a">aaa</option><option value="b">bbb</option></select></td> </tr> </table> <table> <tr> <td><input name="btnAdd" type="button" value="Add Row" οnclick="m_AddRow();"/></td> <td><input name="btnDel" type="button" value="Del Row" οnclick="m_DelRow();"/></td> <td> </td> </tr> </table> </form> <mce:script language="javascript"></mce:script> </body>

bruni

发布了226 篇原创文章 · 获赞 7 · 访问量 44万+

私信关注

發表評論

所有評論

還沒有人評論，想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.

HTML+Javascript复制表格行并清空form表单input/select值.

24-5-18 X

解決CVS訪問慢的問題

Eclipse javadoc plugin: jautodoc

解決MyEclipse中"Open In Explorer"問題

hibernate.org被黑了?

Oracle收購Java

https://yachay.unat.edu.pe/blog/index.php?comment_area=format_blog&comment_component=blog&comment_co

linux以太網驅動總結